<
[toc]
## Good JS tutorials
1. [Stackify Bumper List](https://stackify.com/learn-javascript-tutorials/) - list of tutorials with descriptions.
2. [js for cats](http://jsforcats.com) seems pretty good w a focus on building stuff rather than dry info.
3. [Tania Rascia](https://www.taniarascia.com/) several good pages on different bits about Javascript.
4. [Javascript.info](https://javascript.info/) has a nice easy start. Written tutorials. Gets boring after a short while.
5. [Javascript.com](https://www.javascript.com/try) is designed especially for beginners.
6. [Guru99](https://www.guru99.com/interactive-javascript-tutorials.html) is an absolute beginner’s guide. You can learn all the basics of JavaScript in about 5 days
7. [Wes Bos JS30 course](https://javascript30.com/) is not a complete beginner course but it is free. Build 30 things in 30 days.
## Tania R's Javascript list in order
This is my order. On her page you can click on code and see the order they were written. However I’m not convinced that is the best order:
1. [How to write comments in Javascript](https://www.taniarascia.com/how-to-write-comments-in-javascript/)
2. [Javascript Day 1](https://www.taniarascia.com/javascript-day-one/), Comments, Variables, Data Types, and Hello, World!
3. Javascript day 2
4. [Understanding Syntax and Code Structure](https://www.taniarascia.com/understanding-syntax-and-code-structure-in-javascript/)
5. [How to Work with Strings in Javascript](https://www.taniarascia.com/how-to-work-with-strings-in-javascript/)
6. [Understanding Objects](https://www.taniarascia.com/understanding-objects-in-javascript/)
7. [Understanding functions in Javascript](https://www.taniarascia.com/how-to-define-functions-in-javascript/)
8. [Understanding date and time in Javascript](https://www.taniarascia.com/understanding-date-and-time-in-javascript/)
9. [How to write conditional statements](https://www.taniarascia.com/how-to-write-conditional-statements-in-javascript/)
10. [How to use object methods](https://www.taniarascia.com/how-to-use-object-methods-in-javascript/)
11. [Understanding arrays in Javascript](https://www.taniarascia.com/understanding-arrays-in-javascript/)
12. [How to use array methods in Javascript: Iteration methods](https://www.taniarascia.com/how-to-use-array-methods-in-javascript-iteration-methods/)
13. [How to use array methods in Javascript: Accessor methods](https://www.taniarascia.com/how-to-use-array-methods-in-javascript-accessor-methods/)
14. [How to use array methods in Javascript: Mutator methods](https://www.taniarascia.com/how-to-use-array-methods-in-javascript-mutator-methods/)
15. [How to paginate an array in Javascript](https://www.taniarascia.com/how-to-paginate-an-array-in-javascript/)
16. [Intro to the DOM](https://www.taniarascia.com/introduction-to-the-dom/)
17. [Understanding the DOM tree and Nodes](https://www.taniarascia.com/how-to-construct-for-loops-in-javascript/)
18. [How to access elements in the DOM](https://www.taniarascia.com/how-to-access-elements-in-the-dom/)
19. [How to traverse the DOM](https://www.taniarascia.com/how-to-traverse-the-dom/)
20. [How to make changes to the DOM](https://www.taniarascia.com/how-to-make-changes-to-the-dom/)
21. [How to construct for loops in Javascript](https://www.taniarascia.com/how-to-construct-for-loops-in-javascript/)
22. [Understanding classes in Javascript](https://www.taniarascia.com/understanding-classes-in-javascript/)
---
## Level Up tuts by Scott Tolinski
1. [Level Up on UX][1] by Scott Tolinski. 10 vids.
2. [Level Up on GitLab CE][2] 13 vids
3. [Level Up on VS Code][3] 6 vids.
4. [Level Up, Learning Gulp][4] - 11 vids.
5. [Level Up Tips][5] 16 vids.
6. [Level Up Command line basics][6] 7 vids
7. [Level Up Stylus](https://www.leveluptutorials.com/tutorials/stylus-tutorials) 15 vids.
8. [Level Up HTML 5](https://www.leveluptutorials.com/tutorials/html5-tutorials) 19 vids.
9. [Leve Up PostCSS](https://www.leveluptutorials.com/tutorials/postcss-tutorials) 17 vids.
10. [Level Up CSS experiments](https://www.leveluptutorials.com/tutorials/postcss-tutorials) 10 vids.
11. [Level UP Website perfomrance](https://www.leveluptutorials.com/tutorials/website-performance-tutorials) 10 vids.
12. [Developer Life](https://www.leveluptutorials.com/tutorials/developer-life) 3 vids.
13. [CSS Animations and Transitions](https://www.leveluptutorials.com/tutorials/css-animations-transitions) 16 vids.
---
## How to Learn Anything Fast by Josh ?
1. Takes about 20 hours or 40 mins per day of *focused* study for 1 month
2. Break it down into component sub-skills
3. Read/ Skim 3-5 books etc. on the subject to see what are the most important things to learn
4. Remove any/all distractions so you can give your undivided attention to the practice.
5. Make it easy for yourself to practice
6. Pre commit to at least 20 hours of focused practice before you begin.
1. The early hours of practice are frustrating for everyone. Pre commitment means you'll push past the difficult early period.
There are three stages to Learning
1. Hard difficult
2. Can start to do it without thinking
3. Automatic
---
## Some Markdown notes
1. You can add links at the bottom of a page to keep them out the way (like this page)
Write the text out as normal in square brackets then put a number (or any text string) in a second set of brackets:
`[Awesome website to see][1]`
Then at the bottom of the page or whereever you want, you put the full link preceded by:
1. The number in square brackets
2. a colon
3. and a space
Thus: `[1]: http://www.awesome-website.com/`
2. When adding code blocks you can just intent the code and it should appear as a block.
However using 3 backticks and the beginning and end AND writing the language immediately after the first set of backticks will help parsing the code and add syntax highlighting.
```css
body {
font-size: 30px;
color: red;
}
```
3. To make tables:
1. separate the headings with pipes
2. Add a blank row showing ` |:------|:------|`
3. With the colons on the L the text will be left aligned. To centre the text add a colon on each side or R side for R aligning.
4. You can make checkboxes in markdown. Like a list and one on top of another:
1. [ ] frogs
2. [x] toads
3. [ ] snakes
4. [ ] lizards
To create on just use square brackets with a space in between. To tick on use and `X` instead of a space.
[1]: https://www.leveluptutorials.com/tutorials/ux-prototyping-with-principle
[2]: https://www.leveluptutorials.com/tutorials/gitlab-ce-tutorials
[3]: https://www.leveluptutorials.com/tutorials/vscode-tutorials
[4]: https://www.leveluptutorials.com/tutorials/vscode-tutorials
[5]: https://www.leveluptutorials.com/tutorials/vscode-tutorials
[6]: https://www.leveluptutorials.com/tutorials/vscode-tutorials
]]>