/jscc-welcomeguide

JavaScript Crash Course 3d Edition. Welcome Guide. https://wtmberlin.com/

JavaScript Crash Course  wtm-logo  Welcome Guide

Intro

First of all, welcome to the 3rd Edition of our Javascript Crash Course! This is going to be a challenging but exciting journey for getting started in the programming world.

In this guide we will go through all the steps and tools you will need to get ready for the classes. Please, make sure that you have all the tools installed and ready to go before starting the course.

You might feel a bit overwhelmed sometimes, especially if it is the first time you are hearing about some of these tools and concepts. Please bear with us! 🐻 Just try to get the main concept, and contact us with any doubts or problems you encounter during the process (later we will explain how to get in touch with us during the course).

We will provide information about tools for macOS and Windows in this guide. If you use another systems like Linux, and you don't find the download links or enough information, please get in touch with us.

Chrome

Chrome will be the browser of choice, due to its complete developer integrated tools. Make sure that you have the latest version installed on your computer.

Slack

Slack is the messaging tool that we use to communicate during the course: macOS Download | Windows download.

Important 🔈: Get your personal invite to our WTM slack workspace by typing your email here.

On our #js-crash-course channel you will be able to ask questions, get support and share the link of your homework so we can review it and give you feedback. If you cannot see it on the left menu of the slack app under Channels, you can search for it after clicking on the title.

Visual Studio Code

Visual Studio Code is the IDE (Integrated Development Environment) we will use during the course. In simpler words, is the tool that we'll use to write code.

Terminal

Terminal, also known as command line or console, allows us to accomplish and automate tasks on a computer without the use of a GUI or graphical user interface. Even if many tasks can be done by interacting with the GUI (for example deleting or creating folders), there are some actions which are easier and faster to perform through the terminal, especially when working with Git (which we explore in our next point).

On the course we will mainly use the integrated Terminal in Visual Studio Code, but it is basically the same as the one you can find on your computer (macOS). We recommend you to have a basic understanding of how it works. You can take a look to this complete and fun-to-read guide.

Windows users: We will mostly be using the integrated terminal of Visual Studio Code. Depending on your Windows version, this will be either powershell or cmd.exe. Some commands will be a little different to those on macOS and Linux, but you can find helpful info in this guide. If you really want to use a bash Terminal (the default macOS and Linux one), you can follow the instructions referenced in the guide above to enable one.

Git and Github

Git is a version control system, which allows us to understand the history of a file and how it has progressed (a well-known example would be the Revision History of Google Drive documents).

Github is the tool we use to share and upload our projects. You will need a Github account and a basic knowledge of how to use it.

🙋 Feel free to check our short intro for start getting familiarized with Git.

We recommend you to also go through this guide to learn how to work with both of them. It is a bit long but very complete, and you will get a good understanding on how to use them from scratch, and be able to use them during the course.

Now is time to prove your git learnings playing a little! 👉 https://learngitbranching.js.org/

😇 This is the basic set up you will need for the first lesson. Continue to get the tools for the rest of the course.

Node.js

Node.js is an open-source, cross-platform, JavaScript run-time environment that executes JavaScript code outside of a browser. In an easier to understand explanation, Node.js is a JavaScript runtime environment that includes everything you need to execute a program written in JavaScript, and is what we will use to create our applications on this course.

On this website you can find the links for installing the latest version of Node.js on your machine.

On macOS or Linux you can also install it via Homebrew. First run the following command to install Homebrew in your machine (copy and paste it on a Terminal window and click enter):

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Once Homebrew is installed, run:

brew install node

To check that it was properly installed, type the following command on the terminal:

node -v

If you receive the version number (e.G: v10.16.3), everything is ok.

MongoDB and Mongo Hub

On our 5th. lesson we will learn how to use MongoDB, an open-source document database. Here you can find the download links for every platform.

To install it using Homebrew (check on the Node.js point how to install it), submit on the terminal the following commands (one after the other):

brew tap mongodb/brew
brew install mongodb-community@4.2

We will also use a MongoDB GUI application (an interactive program where we can easily see and manage the items of our database).

They all work very similarly, but for this course we recommend MongoHub (only macOS, download link) or Robomongo (both platforms, download links).

The most important conmmands are mongod or service mongodb start for connecting to the database, and brew services stop mongodb to disconnect from it.

Docker

In our last class we will learn how to deploy our application using Docker. Docker is a tool designed to make it easier to create, deploy, and run applications by using containers. Containers allow a developer to package up an application with all of the parts it needs, such as libraries and other dependencies, and ship it all out as one package. Source.

On this site you can find the download links for Mac and Windows and all the steps to follow.

If you don't manage to follow all the steps of that guide, don't worry. We will explore it more deeply in our class. You will just need to download and install Docker on your machine, and make sure before the class that is running (On Mac it should appear the little whale on the top menu bar, and if you click on it should indicate that is running. On Windows it will appear on the notifications area, bottom-right of the screen).

Problem solving

The following info will be useful for when you are studying/working on your own. On the class, please raise your hand in the moment you get stuck! There will be several teacher assistants there to help you immediately so you can continue following the class.

One of the skills a developer has to master, and also one of the most difficult to achieve at the beginning, is to find the correct answer for the problem they are facing. You are following the steps, everything seems to be fine and boom, you are receiving a weird error on the console or on VSCode. You have no idea why this is happening! You tried everything... So frustrating. But actually, this problem is faced for experienced programmers on their daily basis. And the solution is... to Google it!

You will master this skill with time (what to actually type on google to find the answer you need), but at first you could try to just copy and paste on the google search the error you are receiving (try to only take the meaningful part of the error, for example: Uncaught SyntaxError: Unexpected identifier. You will probably get as first result a link to Stack overflow.

Stack overflow is a community made by and for developers in which someone asks a question, and other developers answer it. If it's a good answer it gets upvotes, and if it's the answer that solved the problem, the OP (original poster) marks it with a green check. This is very useful for the developer community, because the problem we are currently facing most of the times someone else had it already, therefore here we can find many possible solutions to help with our coding struggles. Take a look to some of the most entertaining questions. 😃

If you are practising at home, and after researching you are more than 20-30 minutes stuck on a problem, is time to ask for help on our channel!


And that's it! 🎉 Please contact us anytime you have doubts or any step of the guide was unclear or didn't work for you. It will also help us make it better for the following students.

Enjoy the course! 🎒

Checklist

Have you everything ready to go? 👀

  • Read the Welcome Guide
  • Chrome
  • Slack and join #js-crash-course
  • Terminal basic learning
  • Git and Github setup
  • Node.js
  • Mongo Hub and MongoDB
  • Docker