{"id":34266222,"url":"https://github.com/yoonghan/yoonghan.github.io","last_synced_at":"2026-05-05T03:07:21.994Z","repository":{"id":21913013,"uuid":"25237131","full_name":"yoonghan/yoonghan.github.io","owner":"yoonghan","description":"Official Walcron webpage","archived":false,"fork":false,"pushed_at":"2026-04-26T23:58:46.000Z","size":87448,"stargazers_count":1,"open_issues_count":7,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-04-27T01:25:06.814Z","etag":null,"topics":["nodejs","reactjs","typescript","webpack","zeit"],"latest_commit_sha":null,"homepage":"https://www.walcron.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yoonghan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2014-10-15T03:20:31.000Z","updated_at":"2026-04-26T23:52:15.000Z","dependencies_parsed_at":"2026-02-26T05:05:08.374Z","dependency_job_id":null,"html_url":"https://github.com/yoonghan/yoonghan.github.io","commit_stats":null,"previous_names":["yoonghan/yoonghan.github.io","yoonghan/walcron"],"tags_count":433,"template":false,"template_full_name":null,"purl":"pkg:github/yoonghan/yoonghan.github.io","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yoonghan%2Fyoonghan.github.io","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yoonghan%2Fyoonghan.github.io/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yoonghan%2Fyoonghan.github.io/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yoonghan%2Fyoonghan.github.io/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yoonghan","download_url":"https://codeload.github.com/yoonghan/yoonghan.github.io/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yoonghan%2Fyoonghan.github.io/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32534972,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-02T12:25:33.646Z","status":"ssl_error","status_checked_at":"2026-05-02T12:24:51.733Z","response_time":132,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nodejs","reactjs","typescript","webpack","zeit"],"created_at":"2025-12-16T17:42:46.014Z","updated_at":"2026-05-02T13:02:19.263Z","avatar_url":"https://github.com/yoonghan.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Walcron - a personal website\n\n[![Build Status](https://img.shields.io/github/actions/workflow/status/yoonghan/yoonghan.github.io/merge.yml)](https://github.com/yoonghan/yoonghan.github.io/actions?query=workflow%3A\"Report+merged+result+on+main\")\n[![codecov](https://codecov.io/gh/yoonghan/yoonghan.github.io/graph/badge.svg?token=HPWQMQPPS1)](https://codecov.io/gh/yoonghan/yoonghan.github.io)\n[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=yoonghan_yoonghan.github.io\u0026metric=alert_status)](https://sonarcloud.io/summary/new_code?id=yoonghan_yoonghan.github.io)\n[![Bugs](https://sonarcloud.io/api/project_badges/measure?project=yoonghan_yoonghan.github.io\u0026metric=bugs)](https://sonarcloud.io/summary/new_code?id=yoonghan_yoonghan.github.io)\n[![Code Smells](https://sonarcloud.io/api/project_badges/measure?project=yoonghan_yoonghan.github.io\u0026metric=code_smells)](https://sonarcloud.io/summary/new_code?id=yoonghan_yoonghan.github.io)\n[![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=yoonghan_yoonghan.github.io\u0026metric=security_rating)](https://sonarcloud.io/summary/new_code?id=yoonghan_yoonghan.github.io)\n[![Vulnerabilities](https://sonarcloud.io/api/project_badges/measure?project=yoonghan_yoonghan.github.io\u0026metric=vulnerabilities)](https://sonarcloud.io/summary/new_code?id=yoonghan_yoonghan.github.io)\n\n---\n\nA personal website for self-learning interest. We host our website in 2 locations:\n\n- [Vercel](https://www.walcron.com)\n- [Github Pages](https://yoonghan.github.io)\n\n```mermaid\nflowchart LR;\n    vercel[NextJS in Vercel] --\u003e github[Static in Github pages];\n```\n\n## How to Use\n\nIn your terminal, run the following command:\n\nFor local execution:\n\n```bash\nnpm run dev\n```\n\nFor test with watch\n\n```bash\nnpm run test\n```\n\nFor test coverage\n\n```bash\nnpm run test:ci\n```\n\nFor package analysing, do not check-in as it contains alot of security issues.\n\n```bash\nnpm install @next/bundle-analyzer\n# Wrap next.config.js with withBundleAnalyzer({...})\nnpx next build\n```\n\nFor linting and prettifier check\n\n```bash\nnpm run lint\n```\n\nFor BackstopJS - regression for view and approve website design UI\n**Note**: that browser executes differently in OS, especially font's. In this case use the approved generated backstopJS snapshots directly from the OS/Docker container.\n\n```bash\nnpm run backstop:test  //To test\nnpm run backstop:approve // Approve the new website ok\n```\n\nTo stop animation, append query string to use `animate-none` class\n\n```js\n?animate=none\n```\n\n## Setting environments\n\n1. Install Vercel Cli, with `npm i -g vercel`\n2. Pull all the environment into local with `vercel env pull .env.local`. This wil create an environment straight for testing. Incase, there are reset of environment to setup in Vercel, refer to .env file.\n\n## Additional environment id in Next.JS\n\n1. CORS_ALLOW_ORIGIN - for whitelisting /api url defined in next.config.js to external apps.\n2. NEXT_PUBLIC_SITE_URL - configure for static site to call api. Overrides blank with https://www.walcron.com.\n3. NEXT_PUBLIC_API_SITE_URL - Indicate local api is url.\n4. NEXT_PUBLIC_GA_4_ID - Google 4 Tag Manager Ids\n\n## Run Github workflows\n\n![GitHub Workflow Architecture](public/img/workflow-architecture.svg)\n\nIn case there is a need to generate a new backstopJS approved page.\n\n1. In github, go to _Actions_ tab.\n2. Select 'Create Approved Snapshot By File'.\n3. Click on 'Run workflow'\n4. Enter the vercel/public website to generate an approved website domain. Without http, e.g. https:\\/\\/www.walcron.com to www.walcron.com\n5. Manually enter a valid branch it can checkout, e.g. develop.\n\nUpdating backstopJS snapshot.\n\n--By pull request / action\n\n1. Download the artifacts generated in \"Summary\" of the latest build. Replace generated snapshot in backstop*data/bitmaps_test/*/!failed\\_.png\n2. replace into bitmaps_reference.\n\n--Auto approval _(Recommended)_\n\n1. Get the latest pipeline no from _snapshotcheck.sh_ output from previous failed _Validation_ workflow.\n2. OR view latest running script in github's _Actions_ tab for _Validation_ workflow.\n3. Execute the command below and it will auto-approve and rerun _Validation_ workflow again.\n\n```\necho ${running no# +1} \u003e backstopjs.approve\ngit add backstopjs.approve\ngit push\n```\n\n_Note:_ Add create PAT, personal profile -\u003e Developer Settings -\u003e Fine Grain Token -\u003e Actions(R)/Commit Statues(RW)/Contents(RW)/Metadata(R)\n\n## Deployment to Vercel\n\n1. Required an NPM token for private repository. See \"Deployment for Github NPM_TOKEN for private repo\"\n2. Login locally into github NPM repo with the PAT.\n\n`npm login --scope=@yoonghan --auth-type=legacy --registry=https://npm.pkg.github.com/`\n\n3. Copy in ~/.npmrc into vercel's variable NPM_RC. Basically the variable will contain:\n\n```\n//npm.pkg.github.com/:_authToken=...\n@yoonghan:registry=https://npm.pkg.github.com/\n```\n\n## Deployment for Github NPM_TOKEN for private repo\n\n1. For accessing private repo, please allow Profile -\u003e Settings -\u003e Personal Access Token (classic), open read:packages (basically the same as vercel deployment). For more info refer: https://docs.github.com/en/packages/working-with-a-github-packages-registry. Add as Github secret in Settings-\u003eSecrets And variable and add NPM_TOKEN key. NOTE: During npm install NODE_AUTH_TOKEN variable is read instead.\n2. Workflow requires\n3. registry-url in checkout action,\n4. NODE_AUTH_TOKEN env. If the workflow is callable, use \"secrets: inherit\", else secret cannot be shown. To test print with `echo ${#NODE_AUTH_TOKEN}` and should return some integer values.\n5. Same/extra NPM_TOKEN needs to be created for dependabot under Profile -\u003e Security -\u003e Dependabot.\n\n## Control Node version\nSet via Settings -\u003e Secret and Variables -\u003e Actions -\u003e Variables -\u003e Repository Variables. Add NODE_VERSION with value 22.\n\n## Vercel/NextJS\n\n1. NextJS on vercel re-uses .next build cache. This sometimes creates an issue, e.g. a page that was once deployed as AMP will forever be recognized as AMP until the cache is cleared.\n2. To build without previous build cache; click redeploy button from Vercel dashboard (a menu from the 3 vertical dots) and uncheck \"Build with previous build cache\".\n\n## NextJS Static Site Generation\n\n1. Add `output: \"export\"` to `next.config.js`. This will generate a static site that can be hosted on any static hosting provider.\n2. Remove _/api_ folder as this contains \"use server\" which is not allowed in static site.\n3. Process.env variable are required for client side access. Ease setup is to use `vercel env pull` to pull the environment variables from Vercel.\n4. Run `npx serve@latest out` to test locally.\n\n## Rust Webassembly\n\n1. To regenerate new Wasm from webassembly, run the command below:\n2. The scripts include a custom .gitignore.\n3. Incase wanted to run rust:test, remove --headless and browse with https://localhost:8000. Failed to run it in MacOS.\n\n```\nnpm run rust:generate\nnpm run rust:test //test rust running on browser\n```\n\n## Opentelemetry view\n\n1. Set variables configured in axiom to view telemetry AXIOM_API_TOKEN and AXIOM_DATASET_NAME.\n2. To show open telemetry logs, run OTEL_LOG_LEVEL=debug.\n\n## Using Vibe code.\n\nAdding Gemini capabilities to understand the project. Instructions are added into Gemini.md. Also supported for Antigravity.\n\n## Mermaid generator\n\n```bash\nnpm run generate:mermaid\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoonghan%2Fyoonghan.github.io","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyoonghan%2Fyoonghan.github.io","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoonghan%2Fyoonghan.github.io/lists"}