Skip to content
This repository was archived by the owner on Dec 14, 2019. It is now read-only.

Fix #5 Issue #8

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
139 changes: 138 additions & 1 deletion LearnToCode/JavaScript/JavaScript.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,140 @@
# Javascript

Coming soon...
JavaScript is an interpreted prototype-based, weakly typed programming language that supports event-driven, functional and object-oriented programming paradigms. A common misconception is that JavaScript is a based from the Java programming language but that is not true. **Java is to JavaScript as Ham is to Hamster.**

JavaScript is standardized by the ECMA (European Computer Manufacturers Association) and thereby officially named ECMAScript or ES. ECMA continues to release functionality for JavaScript by major version numbers and more recently by years starting with ES6/ES2015. ES6 marked a major functionality expansion in JavaScript. ES6 is sometimes used to describe everything including and after ES6, including ES7/2016, ES8/2017, etc... A new label of ES.Next is used to describe the latest additions to JavaScript.

Below is "Hello World" example that you can run right in your browser's developer tools console.

```js
alert("Hello World");
```

## Installing JavaScript

JavaScript does not require a specific installation to start using it outside of a web browser.

### Web Browsers

When you install a web browser, it comes with a JavaScript runtime installed. Some of the most popular web browsers are:

* [Chrome](https://www.google.com/chrome/) / [Chromium](http://www.chromium.org/) - MacOS, Windows, Linux, iOS, Android
* [Firefox](https://www.mozilla.org/en-US/firefox/) - MacOS, Windows, Linux, iOS, Android
* [Opera](https://www.opera.com/) - MacOS, Windows, Linux, iOS, Android
* [Brave](https://brave.com/) - MacOS, Windows, Linux, iOS, Android
* [Safari](https://www.apple.com/safari/) / Mobile Safari - MacOS, iOS
* [Edge](https://www.microsoft.com/en-us/windows/microsoft-edge) / Internet Explorer - Windows

### Web Based

Over the past few years, online development environments have exploded. You can program javascript in these environments without the need to setup anything locally on your computer. Some of them have the ability to import frameworks as well and even CodeSandbox has the option to use Visual Studio Code in the browser. Here is a list of some of the popular options:

* [Codepen](https://codepen.io/)
* [JSFiddle](https://jsfiddle.net/)
* [REPL>it](https://repl.it/)
* [CodeSandbox](https://codesandbox.io/)
* [Cloud9 by AWS](https://c9.io/)

### Local Installation

For a local installation you will need to install a code editor and Node.js. Visit the [Learning Node](../Node.js/NodeJS.md) page for installation instructions. Some of the most common code editors are:

* [Visual Studio Code (aka VSCode)](https://code.visualstudio.com/) - MacOS, Windows, Linux
* [Sublime Text](https://www.sublimetext.com/) - MacOS, Windows, Linux
* [Atom](https://atom.io/) - MacOS, Windows, Linux
* [Brackets](http://brackets.io/) - MacOS, Windows, Linux

*_There are plenty of options for code / text editors, but some are OS specific. The options above are specifically available on MacOS, Windows, and Linux_*

## Beginners

There is a wealth of knowledge on the internet for learning JavaScript. The resources below only scratch the surface and are intended to get someone started that doesn't know where to begin. This is not a comprehensive list by any means, nor should it be seen as requirements. Try each and see which one or ones, work well. Whether just learning web development or you are already skilled with HTML and CSS, these resources will provide a direction.

### [freeCodeCamp](https://www.freecodecamp.org)

A free online web development bootcamp. An amazing resource with a thriving community that will start you on your path to learning web development as a whole. If you are familiar with HTML and CSS, the beginning parts of the curriculum will be a refresher.

### [How To Code in JavaScript by Digital Ocean](https://www.digitalocean.com/community/tutorial_series/how-to-code-in-javascript)

An absolute beginner based collection of JavaScript tutorials. This series is provided by Digital Ocean, who provides virtual private servers.

### [w3schools.com](https://www.w3schools.com/js/)

One of the best beginner resources for web development as a whole. They have a great tutorial to get you familiar with JavaScript among many other things.

### [Mozilla Developer Network (MDN)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)

Next to Stack Overflow, probably the second most used resource on the web about the web. This a great introduction to JavaScript. Also many consider MDN to be the best documentation for JS.

### [Learn JS](https://www.learn-js.org/)

The step-by-step instruction and the on page code and console make this a great learning experience for anyone starting with JavaScript. Currently under construction, but the basics principle sections are up and running.

## Advanced Learners

This section is for those that are looking to move to the next level in JavaScript development. Some of these resources are free and some are paid. You do not have to pay to learn JavaScript, but some of these paid resources are worth the mention.

### [JavaScript 30 by Wes Bos](https://javascript30.com/)

A great and free resource that helps you move from tutorials to real world examples. Laid out in a 30 day program to do one every day. If you were having issues with array methods, this course is great for practical practice.

### [YouTube](https://www.youtube.com/results?search_query=javascript)

YouTube has a wealth of knowledge both good and bad. You must look at the date released or you could learn outdated material. Some providers of great content are (but not limited to):

* Programming with Mosh
* Traversy Media
* freeCodeCamp (especially Beau teaches JavaScript)
* Derek Banas
* The Net Ninja
* LevelUpTuts
* Wes Bos
* LearnCode.academy

### [Node School](https://nodeschool.io/)

Start with the javascripting course then take a deeper dive. A good start would be Count to 6 for ES6, then look for the courses on Promises, Async, Javascript Best Practices, and many more.

### [The Modern JavaScript Tutorial](https://javascript.info/)

A great structured approach to JavaScript. Easy to stop and start and learn at your own pace. The course has recently been rewritten to cover the latest advancements in JavaScript. Parts 2 and 3 start to get into more advanced topics.

### [ES6 for Everyone by Wes Bos](https://es6.io/)

A paid course that is worth the money. It has sections for each of the functionality upgrades and full explanations of the examples. It was recently updated to include examples for Async/Await and other ES7/ES8 upgrades. Follow Wes on Twitter and he usually gives out discount codes every couple of months.

### Online Training Academies

There are several online training academies on the market and all of them offer a trial. Try them all to see which ones you like or if it's not for you. Here are some of the most popular:

* [PluralSight](https://www.pluralsight.com/)
* [Lynda / LinkedIn Learning](https://www.lynda.com/)
* [Team Treehouse](https://teamtreehouse.com/)
* [Codecademy](https://www.codecademy.com/)
* [Udemy](https://www.udemy.com/)

## Frameworks

Once you feel proficient with the JavaScript language you can start looking at frameworks to expand your capabilities. Common JavaScript frameworks are:

### Front-End Frameworks

* [React](https://reactjs.org/)
* [Angular](https://angular.io/)
* [Vue](https://vuejs.org/)

### Back-End Frameworks

* [Express](https://expressjs.com/)
* [Meteor](https://www.meteor.com/)

## Other Resources

JavaScript is everywhere on the web now. The learning possibilities and directions are endless. Here are some other resources that may be interesting:

* [Babel](https://babeljs.io/)
* [Electron](https://electronjs.org/)
* [NextJS](https://nextjs.org/)
* [GatsbyJS](https://www.gatsbyjs.org/)
* [JAMStack](https://jamstack.org/)
* [JavaScript for WordPress](https://javascriptforwp.com/)
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ Use the guide below to navigate to the subject you would like to learn about. P
* [Command Line](./LearnToComputer/CommandLine.md)
* [Git](./LearnToComputer/Git.md) (coming soon)
### [Learn to Code](./LearnToCode)
* [JavaScript](./LearnToCode/JavaScript/JavaScript.md) (coming soon)
* [JavaScript](./LearnToCode/JavaScript/JavaScript.md)
* [Node.js](./LearnToCode/Node.js/NodeJS.md) (coming soon)
* [React](./LearnToCode/React/React.md)

Expand Down