{"id":22052761,"url":"https://github.com/thutterer/js-training","last_synced_at":"2026-05-08T15:53:05.874Z","repository":{"id":85561248,"uuid":"118486559","full_name":"thutterer/js-training","owner":"thutterer","description":"A JavaScript 101 slide-deck","archived":false,"fork":false,"pushed_at":"2018-01-22T17:08:29.000Z","size":2,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-28T21:45:13.078Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://thutterer.github.io/js-training/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thutterer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-01-22T16:53:34.000Z","updated_at":"2018-01-22T17:10:11.000Z","dependencies_parsed_at":"2023-07-30T00:46:33.199Z","dependency_job_id":null,"html_url":"https://github.com/thutterer/js-training","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thutterer%2Fjs-training","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thutterer%2Fjs-training/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thutterer%2Fjs-training/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thutterer%2Fjs-training/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thutterer","download_url":"https://codeload.github.com/thutterer/js-training/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245122736,"owners_count":20564364,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-11-30T15:14:11.919Z","updated_at":"2026-05-08T15:53:00.846Z","avatar_url":"https://github.com/thutterer.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# JavaScript 101\n\nThis is a [remark](https://remarkjs.com/) slide-deck I created for a training I gave.\n\nThe idea was to start with the history from the early days till today.\nAnd then to jump into the cold water and explain the syntax (quirks) while hacking.\nSo after the end of of the slide-deck, the exercise was to create a simple digital clock.\n\nThe steps through which I guided the trainees were as follows:\n\n- start with a blank document and add and explain the basic HTML structure\n- `document.write` and `console.log` something\n- slice `(new Date).toTimeString` and write it in a page element\n- move the code into a function and `window.setInterval` on it\n- put the code into its own file with `\u003cscript src='clock.js'\u003e`\n- add some basic CSS styling, explain and move it into `clock.css`\n- add buttons to turn the display of seconds on and off (to show event handlers)\n- explain differences between `var`, `let` and `const` (scopes) and many other gotchas along the way\n\nA clean version of the desired end result can be found in this [repo](https://github.com/thutterer/now).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthutterer%2Fjs-training","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthutterer%2Fjs-training","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthutterer%2Fjs-training/lists"}