# 新進前端人員教育訓練

* 靜態切版
* macos install `brew` + `nvm`
* macos install `iTerm2` + `zsh` + `powerlevel10k`
* vscode setting

{
    "editor.fontSize": 14,
    "editor.tabSize": 2,
    "editor.bracketPairColorization.enabled": true,
    "editor.guides.bracketPairs":"active",
    "prettier.arrowParens": "avoid",
    "prettier.singleQuote": true,
    "prettier.printWidth": 120,
    "workbench.iconTheme": "material-icon-theme",
    "explorer.compactFolders": false,
    "workbench.startupEditor": "none",
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescriptreact]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[typescript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "diffEditor.ignoreTrimWhitespace": false,
    "[html]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "files.autoSave": "onWindowChange",
    "[json]": {
        "editor.defaultFormatter": "vscode.json-language-features"
    },
    "[scss]": {
        "editor.defaultFormatter": "michelemelluso.code-beautifier"
    },
    "explorer.confirmDragAndDrop": false,
}

* vscode plugin
* Auto Rename Tag
* Babel JavaScript
* Beautify css/sass/scss/less
* ES7+ React/Redux/React-Native snippets
* ESLint
* Git Graph
* JavaScript (ES6) code snippets
* Material Icon Theme
* npm
* Path Intellisense
* Prettier - Code formatter
* React Extension Pack
* Reactjs code snippets
* Remote Development
* Tailwind CSS IntelliSense
* scss
* ReactJS HankMD
* ReactJS Plugin HankMD
* NextJS HankMD
* NextJS Plugin HankMD
* PostMan 文件參閱

---
目標
1. nextjs、typescript
2. 協助新頁面切版
3. 互相 code review
4. 活動專案維護

https://2021.thef2e.com/