基礎前端開發者
1.1 HTML & CSS
![2019-Web開發技術指南和趨勢](http://p2.ttnews.xyz/loading.gif)
最基礎的知識:
- 語義化的HTML元素
- 基礎的CSS語法
- Flexbox & Grid
- CSS變量
- 瀏覽器開發者工具
1.2 響應式佈局
![2019-Web開發技術指南和趨勢](http://p2.ttnews.xyz/loading.gif)
響應式設計將不再是網頁的加分項, 而是必須的
- 設置viewport
- 非固定寬度
- 媒體查詢
- 使用 rem 替代 px
- 移動優先,柱狀顯示
1.3 基礎的部署工作
學會如何部署一個靜態網站到服務器
- 註冊一個域名(NameCheap, Google Domains)
- 管理共享主機或虛擬機(Inmotion, Hostgator, Bluehost)
- FTP, SFTP 文件上傳(Filezilla, Cyberduck)
- 靜態頁面託管(Netlify, Github Pages)
1.4 SASS預處理器
雖然不是必須的, 但是推薦去學, 基礎知識的掌握很簡單
- 結構化CSS
- 變量
- 嵌套樣式表
- Minxins & 函數
- 繼承
1.5 原生JavaScript語法
不使用任何框架和庫區學習原生的JS語法
- 數據類型, 函數, 條件判斷, 循環, 湊總府
- DOM操作和事件
- JSON
- Fetch
- ES6+(箭頭函數, Promise, async/await, 解構)
1.6 滿足了基本的前端開發者的條件
- 構建靜態站點
- 構建UI佈局(拿到設計圖能夠使用HTML/CSS還原)
- 添加一些交互功能
- 部署和維護網站
一個成熟的前端開發者
2.1 HTML & CSS框架
HTML/CSS框架目前沒有以前那麼有意義, 但是我還是介意你選擇一個學習(這裡作者想隱射的應該是, 在jquery時代, HTML/CSS框架的學習是必須的).
- BootStrap
- Materialize
- Bulma
2.2 Git和其他工作流工具
Git絕對是每一個Web開發者必須掌握的工具, 這裡也有一些其他的工作流工具的建議.,
- 基礎的命令行( touch, cd, mkdir什麼的總得會, 命令行在下面的工具中都會用到)
- Git(版本控制)
- NPM 或 Yarn(包管理)
- Webpack 或者 Parcel(打包工具)
- Gulp 或者 Grunt(任務管理和構建工具)
- 編輯器插件(ESLint, Prettier, Live Server等)
2.3 前端框架
學習一個前端框架在目前前端開發中是必須的.
- 在大公司開發中非常流行
- 更多的交互 & 有趣的UI組件
- 組件化 & 模塊化前端代碼
- 對團隊有利
2.4 狀態管理
對於使用框架的大型前端項目, 你也許需要使用狀態管理工具去管理你的應用級的狀態
- Redux(Context API)
- Apollo(GraphQL Client)
- Vuex
- NgRx
2.5 滿足一個成熟的前端開發者條件
- 構建一個優秀的前端應用
- 流暢和穩定的前端工作流
- 多人開發 & 熟練使用Git
- 請求後端API & 前端數據響應
全棧開發工程師
3.1 學習一門後端語言
成為一個全棧工程師或軟件工程師, 你將需要學習一個服務端語言和相關技術
學習的順序:
- 基礎的後端語言語法
- 數據結構和工作流
- 包管理
- HTTP/路由
3.2 服務端框架
不要重複造輪子, 學習一門框架去構建更好和更快的應用
- Node.js(Express, Koa, Adonis)
- Python(Django, Flask)
- PHP(Laravel, Symfony)
- C# (ASP.NET)
3.3 數據庫
絕大多數覺得應用都會使用到數據庫, 這裡有一些選擇:
- 關係型數據庫(MySQL, PostgreSQL, MS SQL)
- 非關係型數據庫 (MongoDB, Counchbase)
- 雲服務 (Firebase, AWS, Azure, DocumentDB)
- 輕量級(SQLite, NeDB, Redis)
3.4 服務端渲染
像React, Vue 和 Angular等端架都可以進行服務端渲染
- Next.js(React)
- Nuxt(Vue)
- Angular Universal(Angular)
3.5 內容管理系統
內容管理系統允許快速開發併為您的客戶提供更新內容的能力. 在你需要快速開發網站的時候, 它們是很適合的. 特別是對於自由開發者.
- 基於PHP的 (Wordpress, Drupal)
- 基於JS的 (Ghost, Keystone)
- 基於Python的 (Mezzazine)
- 基於.Net的 (Piranha, Orchard CMS)
3.6 DevOps 和部署
學習語言和框架是一回事, 但是安裝環境, 測試和部署有事另外一回事
- 部署 (Linux, SSH, Git, Nginx, Apache)
- 平臺 (Digital Ocean, AWS, Heroku, Azure)
- 可視化(Docker, Vagrant)
- 測試 (單元測試, 集成測試, 函數式測試, 系統測試)
3.7 滿足全棧工程師的條件
- 設置全棧的開發環境和工作流
- 構建後端服務API和微服務
- 數據庫操作
- 能夠獨立開發應用(前端和服務端)
- 部署到雲端(SSH, Git, Servers等等)
來自:李棠輝
鏈接:https://segmentfault.com/a/1190000017483325
閱讀更多 影帝小碼 的文章