Front-End

1. Basic Tools

• Computer
• Text Editor : VS Code
• Browser : Chrome, Edge, Safari, Firefox
• Terminal (터미널 명령??)

2. Fornt-end

• HTML: 웹의 기본적인 골격
  - HTML Tags
  • Page Structure
  • Semantic Tags
  • SEO
  • Accessibility
• CSS: HTML에서 스타일을 입히고, 사용자에게 어떻게 보여줄 것인지 결정
  - Styling
  • Layouts
  • Responsive Design
  • Animation
  • +) CSS에서 어떻게 클래스 이름을 작성하면 좋을지 - BEM이라는 Architecture
  • +) CSS 전처리기 - Sass, Less, PostCSS
    변수 선언 가능 -> 재사용성 증가
  • +) CSS Framework - Bootstrap
    미리 만들어진 UI 이용
• JavaScript: 동작 추가
  - ES6 + Syntax
  - Basic
  - Advanced (Prototype, Hoisting, Scope, Closure)
  • Browser AIPs
    • DOM Manipulation
      • Events
      • Fetch API (Async)
  • +) TypeScript
  • +) JavaScript Framework (React, Vue, Angular, Svelte)
  • +) Static Site Generator (SSG) : Gatsby(React), GridSome(Vue)
  • +) Server Side Rendering (SSR) : Next.js(React), Nuxt.js(Vue)
    

3. Tools

• Version Control System - Git
• Package Manager - npm, yarn
• Module Bundler - Webpack

4. Testing

• Test Pyramid - Jest, Cypress, Enzyme, react-testing-library
• Good Test Principles

5. Publish

• Github Pages
• Netlify
• Vercel
• Heroku
• AWS

Back-End

• Public APIs
• Firebase
• RestAPI