Develop Tech Tree

한계는 스스로 인지하지 못한채 스스로가 정한다.

---

아래의 로드맵에 대해서 잘 이해하고, 공부하면 도움이 많이 될 것이라고 생각함.

Front-end Roadmap

• Basic Tools
  Computer - MacOS, Windows, Linux
  TestEditor - Atom, Sublime Test, VS Code, IntelliJ
  Brower - Chrome, Edge, Safari, Firefox
  Terminal - Powershell, Bash, zsh
• Front-end / SPA
  • HTML(Structure)
    • HTML Tags
    • Page Structure
    • Semantic Tags
    • SEO
    • Accessibility
  • CSS(Presentation)
    • Styling
    • Layouts
    • Responsive Design
    • Animation
    • BEM - Architecture
    • Sass - Preprocessors
    • Less - Preprocessors
    • PostCSS - Preprocessors
    • CSS Framework
      • Bootstrap
      • PostCSS
      • Tailwind CSS
      • Material UI
      • Styled-Components
  • Javascript(Behavior)
    • ES6 + Syntax
      • Basic
        let, const, if, for, switch, while, function, object
      • Advanced
        Prototype, Hoisting, Scope, Closure
    • Brower APIs
      • DOM Manipulation
      • Events
      • Fetch API ( Async )
    • TypeScript
      • Types
      • OOP
    • Framework
      • React
      • Vue
      • Angular
      • Svelte
  • Static Site Generators(SSG)
    • Gatsby(React)
    • GridSome(Vue)
    • 11ty(JS)
  • Server Side Rendering(SSR)
    • Next.js(React)
    • Nuxt.js(Vue)
    • Universal(Angular)
    • Sapper(Svelte)
• Tools
  • Version Control System
    Git - GitHub, Bitbucket, GitLab
  • Package Manager
    npm
    yarn
  • Module Bundler
    Webpack
    Rollup
    Parcel
• Testing
  • Test Pyramid
    Jest
    Cypress
    Enzyme
    react-testing-library
  • Good Test Principles
  • CI/CD
• Publish
  • github Page
  • Azure
  • Vercel
  • Heroku
  • Netlify
  • AWS
• Backend
  • Public APIs
  • Firebase
  • Backend Roadmap
• Continuous Learning
  • Web Assembly ( C, C++, Rust )
  • GrapshQL
    Apollo
    Relay
  • Cross Platform
    • Desktop
      Electron
    • Mobile
      PWA
      Cordorva
      React Native
      Flutter
  • AI
    • TensorFlow
    • Synatic
    • Brain.js
  • Web 3.0

참고 링크

2022 웹개발 로드맵 총정리