• Stars
    star
    372
  • Rank 114,858 (Top 3 %)
  • Language
    JavaScript
  • Created about 6 years ago
  • Updated 9 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

[Course] Code for Introduction to Node.js

Intro to Nodejs

Scott Moss & Frontend Masters

Resources

Course

Thanks for taking the Introduction to Node.js course -- the course has two parts: slides and exercises. The slides describe the exercises in detail. Each exercise have a folder.

Exercises

Installing Node

Install node with node version manager (NVM). NVM was created by the community and not the Nodejs foundation. However, it is the recommended approach. After installing nvm, use nvm to install the lates version of Nodejs, which at this time is 10 and set it to the default version

nvm install node # node is an alias for the latest version
nvm alias default node

If this fails, or you want to install nodejs from nodejs source, then go here

Important: After installing node, please run npm install i or npm install to install the dependencies located in the package.json file (utilized in future exercises).

Modules (node vs browser)

  • location - exercises/modules
  • commands
    • test - npx jest

This exercise will have you convert some JavaScript written for the browser, so that it works with node.

  • checkout to start branch
  • check the README on how to run test (will talk later about that command)
  • fix and convert the 3 js files in the exercises/modules/browser to Nodejs JavaScript and place them in exercises/modules/node
  • ensure all tests pass by running test command again

CLI (npm)

  • location - exercises/cli
  • commands
    • new - node exercises/cli/index.js new
    • list - node exercises/cli/index.js list

You'll be creating a CLI program that saves and retrieves contacts from and address book. The program is partially there, however, you must install some remote modules, and use the fileSystem to get some things to work.

  • install all remote modules (hint: use npm)
  • check the README on how to run your CLI
  • Fix the CLI so that the "new" command works by saving contacts to contacts.json
  • Fix the CLI so that the "list" command works by listing all contacts and allowing you to select one, the prints out the selected contact

API (async code)

  • location - exercises/api
  • commands
    • start the server - node exercises/api/server.js

You'll be refacoring and fixing a simple static asset server. The server uses blocking sync code and crashes whenever a request comes in that is asking for an asset that is not found. Neither of those are desirable. You'll also have to teach the server how to server the assets it has in the assets folder.

  • install all remote modules (hint: use npm)
  • check the README on how to run your server
  • refactor the sync file reading code to be async with a callback, promise, or async await
  • prevent the server from crashing when an assets is not found. Instead, respond with a 404 status code
  • create some sort of router logic to handle incoming requests for assets

Debugging & Testing

  • location - exercises/testing
  • commands
    • start the server - node exercises/testing/index.js
    • test - npm test or yarn test or npx jest

You have to debug and track down some issues in a small app. Use your logging and inspector to find them. Try and fix them, once you do, write some test to make sure it stays fixed 👌🏾😎💯

  • checkout to start branch
  • check the README on how to execute this program and run test
  • there are 3 bugs, find them and fix them
  • write some unit test with Jest to make sure those bugs stay fixed. Refactor the code if you have to

Sharing and Deploying

Deploy one of the exercises to heroku (server) or npm (cli)

More Repositories

1

front-end-handbook-2018

2018 edition of our front-end development handbook
HTML
4,187
star
2

front-end-handbook-2019

[Book] 2019 edition of our front-end development handbook
HTML
4,107
star
3

front-end-handbook-2017

2017 edition of our front-end development guide
HTML
3,824
star
4

front-end-handbook

The resources and tools for learning about the practice of front-end development.
HTML
1,799
star
5

front-end-handbook-2024

A guide to modern front-end web development / engineering.
HTML
1,182
star
6

learning-roadmap

The Front-End Developer Learning Roadmap by Frontend Masters
HTML
1,014
star
7

bootcamp

Frontend Masters Bootcamp
HTML
701
star
8

api-design-node-v3

[Course] API design in Node with Express v3
JavaScript
696
star
9

react-enlightenment

A thoughtful and complete introduction to React.
HTML
429
star
10

fullstack-graphql

JavaScript
370
star
11

fmmn

frontend masters minneapolis workshop notes
JavaScript
369
star
12

javascript-enlightenment

[Book] JavaScript (ES2015+) Enlightenment
HTML
308
star
13

api-design-node

[Course] API Design in Node.js code
JavaScript
256
star
14

remix-fundamentals

Remix enables you to build fantastic user experiences for the web and feel happy with the code that got you there. Get a jumpstart on Remix with this workshop.
TypeScript
255
star
15

gatsby-intro

Code for the Introduction to Gatsby course.
JavaScript
253
star
16

api-design-node-v2

[Course] API Design in Node.js, v2: REST & GraphQL code
JavaScript
232
star
17

intro-to-graphql

[Course] Introduction to GraphQL
JavaScript
191
star
18

advanced-remix

Remix enables you to build fantastic user experiences for the web and feel happy with the code that got you there. In this workshop, we'll look at some more advanced use cases when building Remix applications.
TypeScript
186
star
19

intro-mongo-db

[Course] Introduction to MongoDB code
JavaScript
181
star
20

2015-02-13-React

[Course] Code for the 2015 React.js workshop with Ryan Florence
JavaScript
170
star
21

grid-flexbox-v2

Version 2 of the Flexbox and Grid course at Frontend Masters.
CSS
152
star
22

hardcore-functional-js-v2

Code for the Hardcore Functional JavaScript, v2 course
JavaScript
142
star
23

service-workers-offline

Code for the Service Workers / PWA section of the Service Workers & Offline course by Kyle Simpson
JavaScript
138
star
24

pure-react-state-management

Pure React State Management course documentation
134
star
25

serverless-with-aws

[Course] Serverless with AWS: Get a quick start into the world of Serverless functions with AWS Lambda.
JavaScript
134
star
26

fm-snippets

Code snippets for course annotations.
JavaScript
119
star
27

advanced-graphql

[Course] Advanced GraphQL - Learn advanced practices and techniques when when building a GraphQL API.
JavaScript
111
star
28

advanced-gql-v2

Code for the Advanced GraphQL Course on Frontend Masters
JavaScript
108
star
29

fm-transcripts

Transcripts of Frontend Masters Courses
91
star
30

ai-nodejs

JavaScript
85
star
31

react-state-management

64
star
32

hardcore-functional-architecture

JavaScript
57
star
33

angular-components

[Course] Code for the AngularJS 1.x Components & ES6 Course
JavaScript
57
star
34

react-web-starter

[Course] starter for react web app
JavaScript
53
star
35

ember-octane

Mike North's Ember Octane workshop
JavaScript
39
star
36

react-native-todo

[Course] Todo app for the React Native Course
Objective-C
32
star
37

ember-github-ui

[Course] Code for the Ember 2.x Course on Frontend Masters
JavaScript
28
star
38

getting-a-job-v3

Watch the course on Frontend Masters
28
star
39

sweat-book

[Course] Work out demo app for the React Native Course
26
star
40

observablish-values

JavaScript
25
star
41

web-workers

Code for the Web Workers section of the Service Workers course by Kyle Simpson
JavaScript
16
star
42

ember-commently

[Course] Code for the Comment.ly Ember.js app for the Advanced Ember 2.x course
CSS
12
star
43

ios-issues

Repository for managing publicly reported issues with the Frontend Masters iOS App
10
star
44

android-issues

Repository for managing publicly reported issues with the Frontend Masters Android App
6
star
45

fullstack-app-next-starter

TypeScript
5
star
46

blazingly-fast-js

JavaScript
5
star
47

javascript-fundamentals-v3

JavaScript
3
star
48

fem-htmx

JavaScript
2
star
49

gitbook-plugin-open-graph

Adds open graph and twitter share meta tags to gitbook
HTML
1
star
50

cielo24_php

[ARCHIVED] A PHP client library for the cielo24.com API
PHP
1
star