---
# System prepended metadata

title: 'Node.js HENRY CLASS(2022/02/08):'
tags: [' npm', ' yarn', Node.js, ' package.json']

---

---
tags: Node.js, yarn, npm, package.json
---
# Node.js HENRY CLASS(2022/02/08):

## :memo: todo list
0. Why not jQuery?
1. What is node.js and npm?
2. Create a new repo for node.js
3. What is yarn
4. Build a simple node.js project
5. Introduce package.json and index.js
6. Bootstrap introduction
7. Challenge!
### 0. Why not jQuery?

![](https://i.imgur.com/mUaFCMN.jpg)


### 1. What is node.js?
Node.js
https://zh.wikipedia.org/wiki/Node.js

NPM
https://zh.wikipedia.org/wiki/Npm

### 2. Create a new repo for node.js
```
  git clone YOUR_REPO_URL
```

### 3. What is yarn
https://yarnpkg.com/

一言概之：改良版的npm，比npm快，能夠達成所有 npm 能夠做的事

*注意：部分指令不一樣*
![](https://i.imgur.com/K5qZPeJ.png)
lodash


### 4. Build a simple node.js project
```
  cd YOUR_REPO_NAME
  npm init -y
```
### 5. Introduce package.json and index.js

### 6. Bootstrap introduction

https://getbootstrap.com/docs/5.1/layout/gutters/
https://www.youtube.com/watch?v=p3CK74T9GHQ


### :snowboarder: Challenge 
https://nodeschool.io/#workshoppers
 
### :snowboarder: Exercise
Make profolio
* https://www.adhamdannaway.com/
* https://ztan.ca/ **
* https://danny.fm/about
* https://themewagon.com/themes/free-bootstrap-4-html5-web-developer-portfolio-website-template-satner/
* https://www.sanity.io/guides/best-developer-portfolio-templates-2021
* brittanychiang.com