├── LICENSE ├── README.md └── animation.svg /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Howard Chiam 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [Learning](https://hchiam.com) 2 | 3 | Links to what [I'm](https://hchiam.com) learning. Languages. Libraries. Frameworks. Etc. 4 | 5 | You might find my Projects and Templates helpful for kickstarting your own learning[.](https://github.com/hchiam/learning-template) 6 | 7 | Chances are, you can guess the URL of each repo: `https://github.com/hchiam/learning-...` 8 | 9 | Or you can browse this README file. 10 | 11 | Or bookmark this search link: 12 | 13 | ## Click to expand 14 | 15 |
16 | Projects 17 | 18 | ## Projects: things that I've built or maintain 19 | 20 | 1. Besides the rest of this list, I contribute to other people's projects, like: [GoogleChromeLabs/ProjectVisBug](https://github.com/GoogleChromeLabs/ProjectVisBug) 21 | 1. [how-draggable](https://github.com/hchiam/how-draggable): make any element [draggable](https://cdn.jsdelivr.net/gh/hchiam/how-draggable@main/makeElementDraggable.js), or [draggable and editable](https://cdn.jsdelivr.net/gh/hchiam/how-draggable@main/makeElementDraggableAndEditable.js) 22 | 1. A minimal [slides](https://github.com/hchiam/slides) editor and presenter in your browser. 23 | 1. A minimal [notepad](https://github.com/hchiam/notepad) in your browser (automatically restores, and works offline after your first visit). 24 | 1. Firefox add-ons like [Check All Scripts with URLVoid](https://github.com/hchiam/urlvoid-firefox-extension) (now works in mobile!) and [Console Log Element](https://github.com/hchiam/console-log-element) (now works in mobile too!) and [togglavatar](https://github.com/hchiam/togglavatar) 25 | 1. Chrome extensions like [a linter](https://github.com/hchiam/in-browser-style-linter), [quick menu search](https://github.com/hchiam/quick-menu-search), [quick selection search](https://github.com/hchiam/select-hover-search), and [experimental test automator](https://github.com/hchiam/in-browser-test-automator) 26 | 1. [\_2DNote](https://github.com/hchiam/_2DNote) to make visuals with 2D coordinates more accessible to people who are blind. 27 | 1. [Google Voice Assistant](https://github.com/hchiam/learning-google-assistant) apps: [Code Tutor](https://github.com/hchiam/code-tutor) and [Mental Temperature Converter](https://github.com/hchiam/mental-temperature-converter) 28 | 1. [`html-template-generator`](https://github.com/hchiam/html-template-generator) and demo site: 29 | 1. [`stylable-select`](https://github.com/hchiam/stylable-select) 30 | 1. [random code tips](https://github.com/hchiam/random-code-tips) 31 | 1. [deps](https://github.com/hchiam/deps), a CLI tool that generates a dependency graph (as an interactive SVG). Just give it a file/folder as a starting point. 32 | 1. [Code Inspiration](https://github.com/hchiam/code-inspiration) to-do list web app that works offline (after your first visit). 33 | 1. No fancy touchpad pen? [Draw by moving the mouse and hitting spacebar to toggle](https://github.com/hchiam/draw-with-mouse-and-spacebar). 34 | 1. [Electron-powered desktop app `anonymous-input`](https://github.com/hchiam/anonymous-input) for personal teaching/educational use. Used Electron.js, Travis CI, mocha, spectron, npm, yarn, ... - although I'd now recommend [Tauri](https://github.com/hchiam/learning-tauri) 35 | 1. [Code Explorer](https://github.com/hchiam/code-explorer) 36 | 1. Voice User Interface named [LUI](https://github.com/hchiam/language-user-interface) 37 | 1. [Experimental programming language](https://github.com/hchiam/please) to make it easier to write code with speech recognition 38 | 1. Convenience code I use in [my CodePen.io Front-End demos](https://codepen.io/hchiam), such as: 39 | - [my personal CSS boilerplate](https://github.com/hchiam/css-boilerplate) 40 | - [codepen-full-page-link](https://github.com/hchiam/codepen-full-page-link) 41 | - [copyToClipboard.js](https://github.com/hchiam/clipboard) 42 | - [a Chrome check message](https://github.com/hchiam/is-chrome) 43 | - [prevent-link-window-opener-attacks.js](https://cdn.jsdelivr.net/gh/hchiam/learning-js@master/prevent-link-window-opener-attacks.js) 44 | - [flying focus ring](https://cdn.jsdelivr.net/gh/hchiam/flying-focus) 45 | - [keyboard focus trap](https://github.com/hchiam/keyboard-focus-trap) 46 | - [morphing_button](https://github.com/hchiam/morphing_button) 47 | 1. [Machine Learning](https://github.com/hchiam/machineLearning) examples and [other ML repos and notes](https://github.com/hchiam/learning-ml), like a [genetic algorithm](https://github.com/hchiam/cogLang-geneticAlgo) to generate a [conlang](https://github.com/hchiam/cognateLanguage), or [text-similarity-test](https://github.com/hchiam/text-similarity-test) built using [TensorFlow.js](https://github.com/hchiam/learning-tensorflow) or [PyTorch](https://github.com/hchiam/learning-pytorch) demos. Or like experimenting with [comment analysis](https://github.com/hchiam/comment-analysis) using [tfjs, USE, and UMAP (as opposed to t-SNE or PCA](https://github.com/hchiam/learning-tfjs-umap). 48 | 1. [Atom plugin](https://github.com/hchiam/sourcefetch-tutorial) tutorial and a [server](https://github.com/hchiam/sourcefetch-server) based on it to seek code snippets for you 49 | 1. [HTML template generator](https://github.com/hchiam/html-template-generator) 50 | 1. API examples: 51 | - 52 | - 53 | 1. [grid](https://github.com/hchiam/grid) - 2D array helper class in JS 54 | 1. [Glitch.com Backend/server demos](https://glitch.com/@hchiam) like [this Node.js server](https://github.com/hchiam/bible-verse-listener) and [this URL shortener microservice](https://minilink.glitch.me/) 55 | 1. Example HTML5 web apps/games (_NOTE: old_): [https://github.com/hchiam/embeddedWebApps](https://github.com/hchiam/embeddedWebApps) 56 | 1. [trysterollup](https://github.com/hchiam/trysterollup) game controller wrapper around Trystero 57 | 1. [canvas-converse](https://github.com/hchiam/canvas-converse) - to more easily "converse" with the canvas API. 58 | 59 |
60 | 61 |
62 | Templates 63 | 64 | ## Templates: repos and snippets to get started faster 65 | 66 | 1. [Azure DevOps](https://github.com/hchiam/learning-azure-devops) 67 | 1. [Bash Scripts](https://github.com/hchiam/learning-bash-scripts) and [PowerShell](https://github.com/hchiam/learning-powershell) and [Zsh](https://github.com/hchiam/learning-zsh) 68 | 1. [Chrome Extension](https://github.com/hchiam/chrome-extension-template) or [Firefox add-on](https://github.com/hchiam/learning-firefox-extension) 69 | 1. [Content Security Policy (CSP)](https://github.com/hchiam/learning-csp) 70 | 1. [convenience](https://github.com/hchiam/convenience) template repo for getting started faster on creating your own convenience scripts or packages (this template repo comes with issue template, PR template, contributor reminder, codeowner, etc. files already set up for better collaboration on GitHub). Like my [learning-template](https://github.com/hchiam/learning-template) or my [project-template](https://github.com/hchiam/project-template). 71 | 1. [Custom VS Code (Visual Studio Code) linter](https://github.com/hchiam/custom-vscode-linter) 72 | - or a more recent VSCode extension: ["Hello deepseek-vscode"](https://github.com/hchiam/deepseek-vscode) 73 | 1. [Cypress](https://github.com/hchiam/learning-cypress) 74 | 1. [Electron](https://github.com/hchiam/learning-electron) for building desktop apps using web technologies (JS/HTML/CSS) 75 | 1. [esbuild](https://github.com/hchiam/learning-esbuild) 76 | 1. [Flask](https://github.com/hchiam/learning-flask) 77 | 1. [flying focus ring](https://github.com/hchiam/flying-focus) and [keyboard focus trap](https://github.com/hchiam/keyboard-focus-trap) and [morphing_button](https://github.com/hchiam/morphing_button) 78 | 1. [GitHub Actions](https://github.com/hchiam/learning-github-actions) 79 | 1. [Godot](https://github.com/hchiam/learning-godot) (game engine) 80 | 1. [Google Apps Script](https://github.com/hchiam/learning-google-apps-script)s for things like Google Docs 81 | 1. Google Assistant App templates: [Code Tutor](https://github.com/hchiam/code-tutor) or [Mental Temperature Converter](https://github.com/hchiam/mental-temperature-converter) 82 | 1. [Google Map Widget](https://github.com/hchiam/learning-google-map-widget) 83 | 1. [gpt4all](https://github.com/hchiam/learning-gpt4all) 84 | 1. [JavaScript](https://github.com/hchiam/learning-js) practice (and [bookmarklets](https://github.com/hchiam/learning-js/tree/master/bookmarklets) and [TotT](https://github.com/hchiam/learning-js/tree/master/TotT)) 85 | 1. [Jasonette](https://github.com/hchiam/jasonetteApps) 86 | 1. [Java](https://github.com/hchiam/learning-java) practice 87 | 1. [Jazzer (and Jazzer.js)](https://github.com/hchiam/learning-jazzer) for fuzzing / fuzz testing 88 | 1. [Jest](https://github.com/hchiam/learning-jest) 89 | 1. [jQuery](https://github.com/hchiam/learning-jquery) 90 | 1. [Keras](https://github.com/hchiam/learning-keras) 91 | 1. [Lighthouse CI](https://github.com/hchiam/learning-lighthouse-ci) 92 | 1. linter stuff like [`lint-staged`](https://github.com/hchiam/learning-lint-staged) to automatically include code style fixes in your commits 93 | - [ESLint with Google JS Style Guide Rules](https://github.com/hchiam/learning-eslint-google) 94 | - [TSLint](https://github.com/hchiam/learning-tslint) 95 | 1. [localGPT](https://github.com/hchiam/learning-localGPT) 96 | 1. [Okta sign-in widget](https://github.com/hchiam/learning-okta-signin-widget) (also serves as a minimal node/express app with its [server.js](https://github.com/hchiam/learning-okta-signin-widget/blob/master/server.js)) 97 | 1. [open-props](https://github.com/hchiam/learning-open-props) 98 | 1. [Phaser](https://github.com/hchiam/phaserGame) 99 | 1. [prompt engineering](https://github.com/hchiam/learning-prompt-eng) - for [ML](https://github.com/hchiam/learning-ml)/LLMs 100 | 1. [Protractor](https://github.com/hchiam/learning-protractor) 101 | 1. [Python](https://github.com/hchiam/learning-python) practice 102 | 1. [Node.js plus Python talking to each other](https://github.com/hchiam/node-plus-python) 103 | 1. Record automated tests with [Selenium IDE](https://github.com/hchiam/learning-selenium-ide) chrome extension, or the slightly-better [Katalon Recorder](https://github.com/hchiam/learning-katalon) chrome extension (which can also export code and other formats). 104 | 1. [robocopy](https://github.com/hchiam/learning-robocopy) (and Total Commander?) 105 | 1. [serverless API functions with CloudFlare workers](https://github.com/hchiam/learning-cloudflare) 106 | 1. [Subresource Integrity (SRI)](https://github.com/hchiam/learning-sri) 107 | 1. [surge](https://github.com/hchiam/learning-surge) 108 | 1. [Tape](https://github.com/hchiam/learning-tape) 109 | 1. [Tauri](https://github.com/hchiam/learning-tauri) 110 | 1. [Teachable Machine](https://github.com/hchiam/learning-teachablemachine) to quickly prototype an ML model (gather, train, export) 111 | 1. [TinyLlama](https://github.com/hchiam/learning-TinyLlama) - another small open-sourced GPT/LLM 112 | 1. [token counters](https://github.com/hchiam/learning-llm-token-counter) for LLMs, like for [prompt engineering](https://github.com/hchiam/learning-prompt-eng) 113 | 1. [Travis CI](https://github.com/hchiam/travistest) 114 | 1. [Travis CI setup for Selenium IDE](https://github.com/hchiam/selenium-travis) 115 | 1. [Travis CI setup example for desktop app (Electron.js) test with mocha](https://github.com/hchiam/anonymous-input) 116 | 1. [trustedTypes](https://github.com/hchiam/learning-trustedTypes) 117 | 1. [TypeScript](https://github.com/hchiam/learning-typescript) 118 | 1. [UglifyJS](https://github.com/hchiam/learning-uglify) 119 | 1. [VB (Visual Basic)](https://github.com/hchiam/learning-vb) 120 | 1. [Vue](https://github.com/hchiam/learning-vue) 121 | 1. [vue-test-utils](https://github.com/hchiam/vue-test-utils-getting-started) with [Jest](https://github.com/hchiam/vue-test-utils-jest-example) and with [Tape](https://github.com/hchiam/tape-vue-example) 122 | 1. [vue-resource](https://codepen.io/hchiam/pen/ZrXgYo) 123 | 1. [Vuetify](https://codepen.io/hchiam/pen/yvPLpb) templates 124 | 1. [Web Components](https://github.com/hchiam/learning-web-components) 125 | 1. [WebRTC](https://github.com/hchiam/learning-webrtc) - P2P (peer-to-peer) communication (tried PeerJS, NetplayJS, Trystero) 126 | 1. Example [Yeoman generator](https://github.com/hchiam/generator-hchiam-learning) [`generator-hchiam-learning`](https://www.npmjs.com/package/generator-hchiam-learning?activeTab=readme) which creates another of my [learning repo](https://GitHub.com/hchiam/learning-something)s. 127 | - or just use [my template repo `learning-template`](https://github.com/hchiam/learning-template) by clicking the green button that says "Use this template" 128 | 129 |
130 | 131 |
132 | Tutorials 133 | 134 | ## Tutorials: things I tried to learn by closely following tutorial instructions 135 | 136 | A bunch of Udacity courses like [Front End Frameworks](https://github.com/hchiam/learning-front-end-frameworks), [Web Tooling & Automation](https://github.com/hchiam/learning-web-tooling-and-automation), [Offline Web Applications](https://github.com/hchiam/learning-offline-web-applications), and [JavaScript Design Patterns](https://github.com/hchiam/learning-js-design-patterns). 137 | 138 | I'm also learning on sites like [freeCodeCamp](https://www.freecodecamp.org/hchiam) and [Udemy](https://www.udemy.com/user/howardchiam/) and [LeetCode](https://leetcode.com/hchiam/) and more. 139 | 140 | 1. [action-dependabot-auto-merge](https://github.com/hchiam/learning-action-dependabot-auto-merge) 141 | 1. [Alexa](https://github.com/hchiam/alexaSample) 142 | 1. [ally.js](https://github.com/hchiam/learning-allyjs#learning-allyjs) 143 | 1. [Alpine.js](https://github.com/hchiam/learning-alpine) 144 | 1. [AngularJS](https://github.com/hchiam/learning-angularjs), [Angular 8](https://github.com/hchiam/learning-angular8), and [Angular](https://github.com/hchiam/learning-angular) 145 | 1. [ANNOY](https://github.com/hchiam/learning-annoy) for [ML](https://github.com/hchiam/learning-ml) nearest neighbours of vectors 146 | 1. [AOS](https://github.com/hchiam/learning-aos) ("Animate On Scroll" library) 147 | 1. [AutoML](https://github.com/hchiam/learning-automl) with AutoML Edge model exported from Vertex AI API of Google Cloud Platform. 148 | 1. [AVIF](https://github.com/hchiam/learning-avif) compressed image format 149 | 1. [axios](https://github.com/hchiam/learning-axios) 150 | 1. [Bazel](https://github.com/hchiam/learning-bazel) 151 | 1. [Bootstrap 4 + SCSS](https://github.com/hchiam/learning-bootstrap) 152 | 1. [canvas](https://github.com/hchiam/learning-canvas) 153 | 1. [CKEditor 5](https://github.com/hchiam/learning-ckeditor5) 154 | 1. [CODEOWNERS](https://github.com/hchiam/learning-codeowners) files 155 | 1. [All Contributors GitHub App](https://github.com/hchiam/learning-allcontributors) 156 | 1. [compromise.js](https://github.com/hchiam/learning-compromisejs) for NLP 157 | 1. [contributing.md](https://github.com/hchiam/learning-contributing.md) files 158 | 1. [CORS](https://github.com/hchiam/learning-cors) 159 | 1. [CSS/CSS3](https://github.com/hchiam/learning-css) 160 | 1. [cucumber](https://github.com/hchiam/learning-cucumber) 161 | 1. [D3.js](https://github.com/hchiam/learning-d3) 162 | 1. [dependency-cruiser](https://github.com/hchiam/learning-dependency-cruiser) 163 | 1. [Django](https://github.com/hchiam/learning-django) 164 | 1. [Docker](https://github.com/hchiam/learning-docker) 165 | 1. [docsify](https://github.com/hchiam/learning-docsify) 166 | 1. [DSPy](https://github.com/hchiam/learning-DSPy) 167 | 1. [ECMAScript browser modules](https://github.com/hchiam/learning-es-browser-modules) (using `import` in the browser) 168 | 1. [Feathers](https://github.com/hchiam/learning-feathers) 169 | 1. [Figma](https://github.com/hchiam/learning-figma) for interactive design prototypes and components (also has an Electron-powered desktop app), and [Bravo](https://github.com/hchiam/learning-bravo-studio) to turn them into native apps(!). (Here's [a quick summary of different design tools](https://github.com/hchiam/learning-figma/blob/main/README.md#a-quick-summary-of-other-design-tools).) For creating images like SVGs, I'd use [Photopea](https://github.com/hchiam/learning-photopea). 170 | 1. [Firestore](https://github.com/hchiam/learning-firestore) and [Firebase Local Emulator Suite](https://github.com/hchiam/learning-firebase-local-emulator) and [Firebase Hosting](https://github.com/hchiam/learning-firebase-hosting) 171 | 1. [My solutions for FreeCodeCamp](https://www.freecodecamp.org/hchiam) (UPDATE: no longer publicly available) 172 | 1. [Gatsby.js](https://github.com/hchiam/learning-gatsby) 173 | 1. [GitHub CLI `gh`](https://github.com/hchiam/learning-gh) 174 | 1. [GitHub Copilot](https://github.com/hchiam/learning-github-copilot) (uses OpenAI Codex) 175 | 1. [GitHub issue template](https://github.com/hchiam/learning-issue-template) 176 | 1. [Golang](https://github.com/hchiam/learn-golang) 177 | 1. [Google Closure Library](https://github.com/hchiam/learning-closure) maybe for things like `goog.structs.Heap()` for use in [practice problems](https://github.com/hchiam/learning-js/tree/master/more-like-interview-questions) that I practice with [eslint and jest](https://github.com/hchiam/eslint-and-jest). It does so many helpful things, but it’s also a FE UI library like [Backbone.js](https://github.com/hchiam/learning-backbone). 178 | 1. [GSAP (GreenSock Animation Package)](https://github.com/hchiam/learning-gsap) 179 | 1. [gzip](https://github.com/hchiam/learning-gzip) 180 | 1. [HTML/HTML5](https://github.com/hchiam/learning-html) 181 | 1. [HTTP status codes](https://github.com/hchiam/learning-http-status-codes) 182 | 1. [HTTPS server](https://github.com/hchiam/learning-https-server) 183 | 1. [Hugging Face](https://github.com/hchiam/learning-huggingface) - for trying out [ML](https://github.com/hchiam/learning-ml) models quickly 184 | 1. [jExcel](https://github.com/hchiam/learning-jExcel) 185 | 1. [jquery-i18next](https://github.com/hchiam/learning-jquery-i18next) 186 | 1. [Kotlin](https://github.com/hchiam/learning-kotlin) 187 | 1. [LangChain](https://github.com/hchiam/learning-langchain) 188 | 1. [lazy load](https://github.com/hchiam/learning-lazy-load) 189 | 1. [Less](https://github.com/hchiam/learning-less) 190 | 1. [Lit.js](https://github.com/hchiam/learning-lit) 191 | 1. [localForage](https://github.com/hchiam/learning-localForage) 192 | 1. [localtunnel](https://github.com/hchiam/learning-localtunnel) 193 | 1. [Lodash](https://github.com/hchiam/learning-lodash) and [Underscore.js](https://github.com/hchiam/learning-underscore) 194 | 1. [Lottie](https://github.com/hchiam/learning-lottie) files for animations 195 | 1. [Material Design Components for the Web](https://github.com/hchiam/learning-material-design-components) (CDN and NPM/Webpack setup) 196 | 1. [MEAN](https://github.com/hchiam/webDevMEANStack) 197 | 1. [mermaid](https://github.com/hchiam/learning-mermaid) 198 | 1. [MERN Stack](https://github.com/hchiam/learning-mern-stack) = **M**ongoDB, **E**xpress, **R**eact, and **N**ode.js (but I'm also using Mongoose, MongoDB Atlas, cors, dotenv, nodemon, eslint, eslint-config-google, bootstrap, react-router-dom, react-datepicker, axios, etc.). 199 | 1. [Mitosis](https://github.com/hchiam/learning-mitosis) 200 | 1. [mocha chai](https://github.com/hchiam/boilerplate-mochachai) 201 | 1. [MongoDB](https://github.com/hchiam/learning-mongodb) 202 | 1. [Neumorphism](https://github.com/hchiam/learning-neumorphism) 203 | 1. [Node](https://github.com/hchiam/learning-nodejs) 204 | 1. [Ollama](https://github.com/hchiam/learning-ollama) to run LLMs locally/privately on your computer. 205 | 1. Publishing your own [NPM package](https://github.com/hchiam/npm-package-example) and [GitHub package](https://github.com/hchiam/learning-github-packages) 206 | 1. [nx](https://github.com/hchiam/learning-nx) 207 | 1. [Parcel.js](https://github.com/hchiam/learning-parcel) web app bundler 208 | 1. [Polka](https://github.com/hchiam/learning-polka) 209 | 1. [Polymer](https://github.com/hchiam/learning-polymer) 210 | 1. [PostCSS](https://github.com/hchiam/learning-postcss) 211 | 1. [pug](https://github.com/hchiam/learning-pug) 212 | 1. [Python ML web app](https://github.com/hchiam/python-ml-web-app) using [Streamlit](https://github.com/hchiam/learning-streamlit) 213 | 1. [PWA + Bluetooth](https://github.com/hchiam/learning-pwa-bluetooth) 214 | 1. [Qwik](https://github.com/hchiam/learning-qwik) 215 | 1. [React](https://github.com/hchiam/learning-reactjs) and [Redux](https://github.com/hchiam/learning-redux) 216 | 1. Small example of adding data to Redux state container: 217 | 1. Bigger example with Redux and more: 218 | 1. [React Router](https://github.com/hchiam/learning-react-router) 219 | 1. [React Native](https://github.com/hchiam/learning-react-native) 220 | 1. Minimal [React Frontend + Express Backend](https://github.com/hchiam/learning-react-fe-and-be) test 221 | 1. [Auth0](https://github.com/hchiam/learning-react-auth0) 222 | 1. [React + Apollo + GraphQL](https://github.com/hchiam/learning-react-apollo) with [a working example](https://github.com/hchiam/react-apollo-gql-example) 223 | 1. [React + Firestore](https://github.com/hchiam/learning-firestore) 224 | 1. [React Hook Form](https://github.com/hchiam/learning-react-hook-form) 225 | 1. [react-testing-library](https://github.com/hchiam/learning-react-testing-library) 226 | 1. [React Error Boundaries](https://github.com/hchiam/learning-react-error-boundaries) 227 | 1. [React Portals](https://github.com/hchiam/learning-react-portals) 228 | 1. [Next.js](https://github.com/hchiam/learning-nextjs) 229 | 1. [mantine.dev](https://github.com/hchiam/learning-mantine) React component library 230 | 1. [reCAPTCHA](https://github.com/hchiam/learning-recaptcha) 231 | 1. [service workers](https://github.com/hchiam/learning-service-workers) and [WebWorkers](https://github.com/hchiam/learning-webworkers) and making an [installable PWA (Progressive Web App)](https://github.com/hchiam/pwa-template) 232 | 1. [snowpack](https://github.com/hchiam/learning-snowpack) and [create-snowpack-app](https://github.com/hchiam/learning-create-snowpack-app) 233 | 1. [Solid.js](https://github.com/hchiam/learning-solid) 234 | 1. [Svelte](https://github.com/hchiam/learning-svelte) and [Sapper](https://github.com/hchiam/learning-sapper) 235 | 1. [SASS/SCSS](https://github.com/hchiam/learning-sass) 236 | 1. [SQL](https://github.com/hchiam/learning-sql) and [Sequelize ORM for Node.js](https://github.com/hchiam/learning-sequelize) 237 | 1. [TensorFlow](https://github.com/hchiam/learning-tensorflow) 238 | 1. [three.js](https://github.com/hchiam/learning-threejs) 239 | 1. [universal-tilt.js](https://github.com/hchiam/learning-universal-tilt) 240 | 1. [Vue with Firebase database](https://github.com/hchiam/vuejsfirebase) and [Glitch.com hosting](https://vue-js-firebase-database.glitch.me/) 241 | 1. [Web Accessibility (a11y)](https://github.com/hchiam/web-accessibility-course-notes/blob/master/README.md) (from [Google's Udacity course](https://www.udacity.com/course/web-accessibility--ud891)) and [`axe-cli`](https://github.com/hchiam/learning-axe-cli#learning-axe-cli) (and [even more a11y notes](https://github.com/hchiam/learning-a11y)) 242 | 1. [Web Dev Bootcamp](https://github.com/hchiam/web-dev-bootcamp) 243 | 1. [web video, image manipulation, and connecting video to CSS animations](https://github.com/hchiam/learning-web-video-and-image) 244 | 1. [Webpack](https://github.com/hchiam/learning-webpack) 245 | 1. [WebSocket](https://github.com/hchiam/learning-websocket) 246 | 1. [yargs](https://github.com/hchiam/learning-yargs) 247 | 1. [yarn](https://github.com/hchiam/learning-yarn) 248 | 1. [Zdog](https://github.com/hchiam/learning-zdog) - pseudo-3D for canvas and SVG 249 | 250 |
251 | 252 |
253 | To learn later 254 | 255 | ## To learn later: thought about learning but didn't go too deep yet 256 | 257 | 1. [Aceternity](https://github.com/hchiam/learning-aceternity) 258 | 1. [amplication](https://github.com/hchiam/learning-amplication) nocode to generate website FE+BE 259 | 1. [Apache ECharts](https://github.com/hchiam/learning-apache-echarts) 260 | 1. [assembly](https://github.com/hchiam/learning-assembly) 261 | 1. [Astro](https://github.com/hchiam/learning-astro) 262 | 1. [AWS (Amazon Web Services) terms in plain English](https://github.com/hchiam/learning-aws-terms) 263 | 1. [Bayes](https://github.com/hchiam/learning-bayes) 264 | 1. [Blitz](https://github.com/hchiam/learning-blitzjs) 265 | 1. [Browsersync](https://github.com/hchiam/learning-browsersync) 266 | 1. [bun](https://github.com/hchiam/learning-bun) 267 | 1. [C#](https://github.com/hchiam/learning-csharp) 268 | 1. [Chrome DevTools](https://github.com/hchiam/learning-chrome-devtools) 269 | 1. [Cirq](https://github.com/hchiam/learning-cirq) for quantum computer circuits 270 | 1. [Combinations vs Permutations](https://github.com/hchiam/learning-combinations-vs-permutations) 271 | 1. [CSS BEM](https://github.com/hchiam/learning-bem) 272 | 1. Data structures and algorithms like the [splay tree](https://github.com/hchiam/learning-splay-tree), [B-tree](https://github.com/hchiam/learning-b-tree), [skip list](https://github.com/hchiam/learning-skip-list), [Bloom filter](https://github.com/hchiam/learning-bloom-filter), [union-find data structure (for sets)](https://github.com/hchiam/learning-union-find), [suffix tree/trie/array](https://github.com/hchiam/learning-suffix-tree), [LZW compression](https://github.com/hchiam/learning-lzw), [combinations vs permutations with/without repeats](https://github.com/hchiam/learning-combinations-vs-permutations) 273 | 1. [Deno](https://github.com/hchiam/learning-deno) 274 | 1. [Elm](https://github.com/hchiam/learning-elm) 275 | 1. [Flutter](https://github.com/hchiam/learning-flutter) 276 | 1. [Framer](https://github.com/hchiam/learning-framer) 277 | 1. [Google Charts](https://github.com/hchiam/learning-google-charts) 278 | 1. [GraphQL](https://github.com/hchiam/learning-graphql) 279 | 1. [gulp.js](https://github.com/hchiam/learning-gulp) 280 | 1. connecting JS to [hardware](https://github.com/hchiam/learning-js-hardware) 281 | 1. [Helmet](https://github.com/hchiam/learning-helmet) 282 | 1. [Heroku](https://github.com/hchiam/python-getting-started) 283 | - --> my first working Heroku-hosted app [here](https://github.com/hchiam/galeria) 284 | - 285 | 1. [Immer](https://github.com/hchiam/learning-immer/blob/master/README.md) to change immutable state more easily. 286 | 1. [general software interview problem solving skills](https://github.com/hchiam/learning-interviews) 287 | 1. [Karma](https://github.com/hchiam/learning-karma) 288 | 1. [Kubernetes](https://github.com/hchiam/learning-kubernetes) 289 | 1. [Nuxt.js](https://github.com/hchiam/learning-nuxt) 290 | 1. [octave](https://github.com/hchiam/learning-octave) 291 | 1. [the OSI model](https://github.com/hchiam/learning-osi) 292 | 1. [P vs NP](https://github.com/hchiam/learning-p-vs-np) 293 | 1. [Pattern Lab](https://github.com/hchiam/learning-pattern-lab) 294 | 1. [Plotly.js](https://github.com/hchiam/learning-plotly) 295 | 1. [privateGPT](https://github.com/hchiam/learning-privateGPT) 296 | 1. [Puppeteer](https://github.com/hchiam/learning-puppeteer) 297 | 1. [PyCharm](https://github.com/hchiam/learning-pycharm) 298 | 1. [react-spring](https://github.com/hchiam/learning-react-spring) for fluid, interactive animations. 299 | 1. [Rome](https://github.com/hchiam/learning-rome) 300 | 1. [RPC (Remote Procedure Calls)](https://github.com/hchiam/learning-rpc) 301 | 1. [Ruby on Rails](https://github.com/hchiam/learning-rubyOnRails) 302 | 1. [Rust](https://github.com/hchiam/learning-rust) 303 | 1. [semaphores](https://github.com/hchiam/learning-semaphores) 304 | 1. [shadow DOM](https://github.com/hchiam/learning-shadow-dom) 305 | 1. [SuperTokens](https://github.com/hchiam/learning-supertokens) 306 | 1. [technical writing](https://github.com/hchiam/learning-tech-writing) 307 | 1. [Vite](https://github.com/hchiam/learning-vite) 308 | 1. [VS Code productivity tips](https://www.youtube.com/watch?v=ifTF3ags0XI) 309 | 1. [Web Assembly (WASM)](https://github.com/hchiam/learning-wasm) 310 | 1. [WebGL](https://github.com/hchiam/learning-webgl) 311 | 1. [WebGPU](https://github.com/hchiam/learning-webgpu) 312 | 1. [YDF (Yggdrasil Decision Forests)](https://github.com/hchiam/learning-ydf) - ML 313 | 314 |
315 | 316 | You can expand all by running this in dev tools: 317 | 318 | ```js 319 | javascript: (function () { 320 | Array.from(document.querySelectorAll(".markdown-body details")).map((d) => 321 | d.setAttribute("open", true) 322 | ); 323 | })(); 324 | ``` 325 | 326 |
327 | 328 | I use bash scripts to generate [new learning repos](https://github.com/hchiam/learning-bash-scripts/blob/main/gh-cli-create-learning-repo-from-template.sh) and sometimes [new project repos](https://github.com/hchiam/learning-bash-scripts/blob/main/gh-cli-create-project-repo-from-template.sh). 329 | 330 | I'm also on [CodePen.io](https://codepen.io/hchiam) and [itch.io](https://hchiam.itch.io) and [Glitch.com](https://glitch.com/@hchiam) and [CodeSandbox.io](https://codesandbox.io/u/hchiam/sandboxes) and [LeetCode.com](https://leetcode.com/hchiam/) and [Bitbucket.org](https://bitbucket.org/hchiam) and [Repl.it](https://repl.it/@hchiam) and [HuggingFace.co](https://huggingface.co/hchiam) 331 | 332 | Auto-generated GitHub résumé: 333 | -------------------------------------------------------------------------------- /animation.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 32 |
33 |

Learning

34 |
35 |
36 |
37 |
38 | --------------------------------------------------------------------------------