Welcome to Walcron website

This is a sandbox website for the two of us to explore real-time Web Development.

We do sometimes use the site to by-pass coorporate networks for private communication.

What is truely important for Walcron development?

This site was up since 2014 and had went thru many iterations [Learn More of our history]; evolved from AJAX/SPA to Pure Server Render to Non-Javascript Accessible site. Our main goal now are DevOps oriented.

Reliability

Being a self-maintained site, how do one...

"Validate his own changes ?"
"Ensure changes doesn't break anything ?"
"A hassle to deploy changes ?"

Github workflows — Github workflow from Testing to Deployment

In Walcron we implement GitHub workflow to do our biddings. A full CI/CD:

Testing - ensure safety in modification. [GitHub Actions]
Integration - API doesn't break. [Smoke and E2E]
Release - Deploys ONLY successful pull-request.

Comparing latest image — Detects before and after User Interface changes

User Interface verification:

Layout verification - Production layout are compared with preview. [Snapshots]
Approval workflow - Integrated approval process. [Snapshots]

Code coverage screenshot — Code coverage in CodeCov

We up-keep coding standards and security compliance:

Coverage - 99.9% lines of code covered.[CodeCov]
Linting - Coding checks to ensure proper coding styles.
Compliance - Security and Lint checks. [OWASP check and Dependabots]
Accessibility - Integrated lighthouse to keep best-practises and accessibility at 100%.

"So what if something really breaks ?"

Face it, this happens with new experimentations. The workflow is built to handles fallback options:

Re-run the release tag in action workflow. Every pull-request is tracked via Release [list of releases] during merge workflow.
Revert via Vercel, but not applicable to GitHub Pages. Useful for API break changes.
A guaranteed revert process is less than 10minutes.

Accessibility (WCAG)

"Our Homepage can now be browsed WITHOUT JAVASCRIPT!!"

We did it by relying on both PureCSS, Server Side Generation and ensuring non-critical usage for Javascript. The old homepage was Javascript heavy(Parallax Effect) and we encountered performance and accessibility issues.

This site can also be browsed with keyboard and text-readers.

We are going now commited with Web Accessibility; eventhough we are still in the learning phase. The best reliance is to run periodically test with Accessibility Checker and Chrome built-in Lighthouse.

The site is Trusted Web Activity(TWA) and Progressive(PWA) compatible.

Monitoring

"Dogfooding. We eat our own dogfood!"

Axiom Telemetry dashboard — Leverage Axiom's Open Telemetry to view API workflow

We use Axiom to stream OpenTelemetry data over. Using this data we can monitor our API's performance and application integration.

View Checklists

Checkly dashboard — Checkly is used to monitor our website up-time.

An alarm system if the website is ever down within 24hours. A dashboard is created as well to check on performance and region latency.

Performance

"Keeping standards and low latency."

We maintain a good performance and accessibility. We use Lighthouse to monitored during deployment.

Google Big Data Query — We page loading data with Google Analytics.

We occasionally monitor our websites loading performances so that we can keep our rating high for SEO. We also collect client' data ONLY if consensus is given; so...please accept the cookie. :)