我的2017年前端之路總結

原文首發于我的博客

年末了,趕著剛考完兩門考試,在最后4門考試來臨之前抽空寫一下今年的小結。

今年格外忙。忙完本科畢設,又馬上投入了研究生實驗室的搬磚生涯。跟去年一樣,列個今年的學習成果清單:

過去的一年

技術成果

2017.03~2017.05.07 開坑學習Three.js,完成了一個簡單的機械裝置展示平臺(我的本科畢設)【Three.js+dat.gui】

2017.05.23~2017.07.15 基于vue2+koa2重構了福建北郵人服務系統,這是我自己的項目。開始引入eslint(以前嫌麻煩233),以后的項目也一并引入。期間在手寫一些常用Vue組件的時候學習了不少東西,寫了一篇Vue組件的三種調用方式【Vue2+Koa2】

2017.05.26 為了上面那個項目簡單做了一個基于stylus的柵格系統css——Melody.css,用來快速做響應式開發。【stylus】

2017.06.07 協助解決實驗室Vue項目里webpack的Hot Reload速度太慢的問題,做了個webpack的開發模式的插件webpack-dev-compile-optimize提升熱重載速度(只在自己內部項目測試過),同期總結了一篇基于vue-cli項目的webpack構建優化文章。【webpack】

2017.07.07 博客開啟持久化構建,依賴于github-page,不過加上了https以及進入了HSTS列表。第一次接觸了Travis-CI,發表了一篇經驗文。【Travis-CI】

2017.08.09 開坑hexo-theme-melody,寫一個送給我妹子的hexo主題,效果見我博客即是。【hexo hexo-theme】

2017.10.09 寫每周電影推薦的時候因為嫌棄獲取電影信息步驟繁雜,于是改造了一下早期寫的node小爬蟲dbmovie-spider支持讀取命令行信息了。【node】

2017.10.28 開始練習算法,并借機學習TypeScript和前端測試(采用了Jest)。 不過后來一直有其他事壓著,沒有持續,等考完試要繼續。【TypeScript Jest】

2017.11.02 開坑vue-koa-demo項目的前端測試。同期寫了一篇Jest 全棧測試的經驗博客。【Jest】

2017.11.18 開坑PicGo,學習electron的基本開發流程,邊寫邊學。最終完成了一個我現在寫博客貼圖片時很方便的工具。并于12月中發布正式版,還上了少數派首頁推薦。【electron】

PS,在掘金也發了一遍推薦不過沒有被推薦到首頁T T

之后應該會發幾篇electron開發的文章。

2017.11.30 抽空把vue-koa-demo的ssr版本做了一下。踩了一些ssr的坑。

對比去年給自己立的目標:

**算法****數據結構****Three.js -> 瀏覽器3D建模****回歸JS語言基礎****學會玩Webpack2****持續的項目開源****Python簡單入門**
復制代碼

感覺除了Python沒怎么學之外(尷尬),其他的目標大致都有所建樹,算是完成地還不錯吧!

期望、目標

依然要寫下2018年需要學習的東西:

  • 算法、數據結構
  • Parcel
  • TypeScript
  • Puppeteer自動化測試
  • PWA
  • 給開源庫提PR
  • github robot
  • 如果可以,學習一下react

隨筆

這一年來的前端的學習之路,收獲還是不少的。比起去年來說,我自己覺得收獲最大的就是在開源社區跟開發者、使用者的交流更多了。因為自己也有開源項目,所以很多時候一些情況也是第一次見:比如第一次遇到PR(開心不已),第一次給開源庫提issue,第一次跟開發者討論項目細節等等。今年還沒有給開源庫提過PR,所以明年的目標是來一個吧~

今年也是前端框架、庫井噴的一年。各種新的技術涌現、較新的技術逐漸走向成熟、成熟的項目走向穩定。這種感覺似乎從我兩年半前學習前端的時候就有了,不過今年真的特別強烈。也因此才有那篇流傳甚廣的《2017年學JavaScript是怎樣的一種體驗》。前端要學的東西太多了啊。不過我覺得雖然看似多,作為前端工程師,還是要有自己的大體學習路線。

我認為如今前端工程師應當分成兩類,

  1. 結合Node的偏向全棧的前端,他們更注重網站的訪問優化、性能提升、毫秒級別的用戶體驗。
  2. 結合CSS\JS的偏向用戶端特效的“純”前端工程師。這部分的前端工程師通常來說必須要有自己的設計認知。

很多優秀的前端工程師都是設計師出身。比如TJ,比如尤雨溪。但是卻不是很常聽說優秀的設計師是前端工程師出身。這就是因為現在很多學前端的人還是在認為自己能夠寫個頁面、套個模板,厲害點的還原個頁面就行了。殊不知,你要學習的不僅僅是前端配套的HTML\CSS\JS,你還需要知道結合了Nodejs后帶來的一系列現代開發工具和工程化的流程。不再是只會用個bootstrap+jquery做個頁面就完事的年代了。刀耕火種的年代已經過去,可是還是有人在抓著舊石器不放。

不過還是需要強調一下,基礎真的很重要。我身邊遇到太多半路“出家”,自愿也好,被迫也罷來學前端的同學,他們很多都是草草幾天看完HTML\CSS\JS基礎,然后就直接用上Vue、React來寫項目了。連npm都不知道是什么東西的他們,很多時候寫起前端來非常痛苦。前端不再是以前那樣認為的是一門可以速成的技術了啊,現在而言,至少入門門檻高了不少。

前端圈還是太浮躁了點。還是沉下心來,好好鉆研自己喜歡的技術吧。

另外,由于最近出現的諸如PWA、Electron、RN、微信小程序等由前端主導的新技術,很多人就說了“啊iOS開發要完啦”、“啊安卓開發要完啦”、“要轉行前端啦”等,我覺得其實還沒有必要恐慌到那個程度。誠然如今前端能做的事不少,但是局限性還是很強。PWA由于依賴高版本Chrome在一般安卓機器上體驗依然不怎么樣,想做出像原生一樣的效果還是受限于機能,iOS就更別說了,雖然safari開始支持service worker,但支持PWA還有待時日;Electron雖然能開發跨端應用,不過還有很多的局限,比如應用體積實在大,比如無法獲取外部當前鼠標選中的文件等等。所以對于新技術應該理性看待,自己親手實踐一下,而不應盲目從眾。

總結一下

今年的技術棧成長:

  • 更加深入Vue的開發
  • 開始學習Three.js
  • 開始用上ESLint
  • 開始學習TypeScript
  • 開始使用前端測試(Jest)
  • 開始學習Electron
  • 開始練習算法
  • 對前端工程化+自動化有更多的實踐和體會
  • 持續維護三個開源項目:vue-koa-demo、hexo-theme-melody、PicGo
  • 學習持續集成

希望我的2018年能夠繼續有所收獲!

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/255835.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/255835.shtml
英文地址,請注明出處:http://en.pswp.cn/news/255835.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

對軟件工程的疑問

在大學時光中學習了算法編程后,我發現我對于源程序理解很差,我只會很低程度的寫代碼,但是基本描述不出來。所以我的編程很差,而且由于我很少打代碼,所以我的編程能力基本沒有多少提高,我也沒有發現該學什么…

【深度學習】——分類損失函數、回歸損失函數、交叉熵損失函數、均方差損失函數、損失函數曲線、

目錄 代碼 回歸問題的損失函數 分類問題的損失函數 1、 0-1損失 (zero-one loss) 2、Logistic loss 3、Hinge loss 4、指數損失(Exponential loss) 機器學習的損失函數 Cross Entropy Loss Function(交叉熵損失函數) 交叉熵優點 Mean Squared E…

伺服電機慣量問題

在伺服系統選型及調試中,常會碰到慣量問題。 其具體表現為:在伺服系統選型時,除考慮電機的扭矩和額定速度等等因素外,我們還需要先計算得知機械系統換算到電機軸的慣量,再根據機械的實際動作要求及加工件質量要求來…

【轉】應用架構一團糟?如何將單體應用改造為微服務

概述 將單體應用改造為微服務實際上是應用現代化的過程,這是開發者們在過去十年來一直在做的事情,所以已經有一些可以復用的經驗。 全部重寫是絕對不能用的策略,除非你要集中精力從頭構建一個基于微服務的應用。雖然聽起來很有吸引力&#xf…

Linux 解決ssh連接慢的問題

備份文件 cp /etc/ssh/sshd_config /etc/ssh/sshd_config.bak 編輯文件 vi /etc/ssh/sshd_config 輸入/ 查找GSSAPIAuthentication 設置如下 GSSAPIAuthentication no # 是否允許使用基于 GSSAPI 的用戶認證。默認值為"no"。僅用于SSH-2 詳細解釋 輸入/ 查找UseDNS …

ABB機器人與PC計算機控制口連接 超級終端 命令清單

條件: 9 針串口通信 RS232。 PC 啟動超級終端軟件。Windows -> Start -> Accessories -> Terminal 通信設置: 1. 波特率 9600 8 位2. 1 個停止位 沒有奇偶校驗3. 沒有 Modern 采用直接串口連接4. 使用 Xon/Xoff 通信形式當故障發生時&#xff0…

【Hibernate】Hibernate系列6之HQL查詢

HQL查詢 6.1、概述 6.2、分頁查詢 6.3、命名查詢 6.4、投影查詢-部分字段查詢 6.5、報表查詢 6.6、迫切左外連接、左外連接 6.7、迫切內連接、內連接 6.8、QBC查詢、本地查詢 轉載于:https://www.cnblogs.com/junneyang/p/5254641.html

【深度學習】——梯度下降優化算法(批量梯度下降、隨機梯度下降、小批量梯度下降、Momentum、Adam)

目錄 梯度 梯度下降 常用的梯度下降算法(BGD,SGD,MBGD) 梯度下降的詳細算法 算法過程 批量梯度下降法(Batch Gradient Descent) 隨機梯度下降法(Stochastic Gradient Descent&#xff09…

Javascript隱式轉換

亂想 javascript為什么需要隱式轉換?如果沒有會出現什么情況? 找了一圈沒有看到關于這個的討論,只好自己研究了,可能不一定正確,自行辨知。 郁悶就是郁悶在好好的,為什么要搞個隱式轉換,一般來講…

雙工位機器人 焊接夾具注意事項 o(╯□╰)o

焊接夾具設計注意事項 一套完美的夾具,需要機械設計人員正確的設計思想,良好的配件質量,鉗工負責認真的裝配質量,卡具在使用中不斷的修磨和改進,才會達到好的效果。 本人非機械設計,只是在使用焊接卡具過程中遇到了很多卡具設計上…

【公共類庫】加密解密

public static class MyEncryption{#region Md5加密/// <summary>/// 使用MD5加密/// </summary>/// <param name"str">需要加密的數據。</param>/// <param name"kind">加密類型&#xff1a;1-普通加密&#xff1b;2-密碼加…

使用JOTM實現分布式事務管理(多數據源)

使用spring和hibernate可以很方便的實現一個數據源的事務管理,但是如果需要同時對多個數據源進行事務控制,并且不想使用重量級容器提供的機制的話,可以使用JOTM達到目的. JOTM的配置十分簡單,spring已經內置了對JOTM的支持,一.<bean id"jotm" class"org.spri…

【機器學習】——《機器學習實戰》面試復習

目錄 一、機器學習概念 二、機器學習步驟 三、有監督學習 1、k-近鄰算法 核心思想 實例&#xff1a;手寫數字的識別 優缺點&#xff1a; 2、決策樹 相關概念 核心思想 一些小技巧 優缺點 3、神經網絡 4、SVM——支持向量機 核心思想 SVM和SVR的區別 ? 優缺點…

一鍵分享代碼

文章出處&#xff1a;http://share.baidu.com/code/advance 一、概述 百度分享代碼已升級到2.0&#xff0c;本頁將介紹新版百度分享的安裝配置方法&#xff0c;請點擊左側列表查看相關章節。 二、代碼結構 分享代碼可以分為三個部分&#xff1a;HTML、設置和js加載&#xff0c;…

ubuntu安裝LDAP

參考文獻&#xff1a; https://help.ubuntu.com/12.04/serverguide/openldap-server.html&#xff08;最主要的&#xff09; http://www.linuxidc.com/Linux/2011-08/40020.htm http://blog.chinaunix.net/uid-24276740-id-3360306.html 前言 在網上搜索ldap的安裝配置&#xf…

58.貪心算法練習:??最小新整數

總時間限制: 1000ms 內存限制: 65536kB 描述 給定一個十進制正整數n(0 < n < 1000000000)&#xff0c;每個數位上數字均不為0。n的位數為m。現在從m位中刪除k位(0< m)&#xff0c;求生成的新整數最小為多少&#xff1f;例如: n 9128456, k 2, 則生成的新整數最小…

ABB機器人之LOADDATA

ABB機器人之LOADDATA loaddata是用來描述連接到機器人機械接口的負載&#xff08;機器人的安裝法蘭&#xff09;。loaddata數據通常定義有效載荷或負荷&#xff08;通過指令gripload設置機器人抓手負載 或mechunitload指令設置變位機負載。loaddata通常也作為tooldata的一部分&…

【深度學習】——性能指標(ROC、MAP、AUC等)

目錄 一、分類任務性能指標 1、混淆矩陣 2、精確度ACCURACY 正確數/總數 3、查全率&#xff08;RECALL&#xff09;——真正正樣本中預測正確的比例 4、查準率&#xff08;precision&#xff09;——預測為正樣本中的預測正確的比例 5、F-score——對查準率和查全率進行結…

【深度學習】——過擬合的處理方法

目錄 一、什么是過擬合&#xff1f;&#xff08;overfitting&#xff09; 二、過擬合的表現&#xff08;判定方法&#xff09; 訓練集、測試集、驗證集區別 測試集與驗證集的區別 三、產生過擬合的原因 1、樣本方面 2、模型方面 四、避免過擬合的方法 1、樣本方面 1&…

ASP.NET頁面的字符編碼設置

在用ASP.NET寫網上支付的接口程序時&#xff0c;遇到一個奇怪問題&#xff0c;通過表單提交過去的中文全是亂碼&#xff0c;英文正常。而用asp程序進行測試&#xff0c;可以正常提交中文&#xff0c;asp頁面中有這樣的HTML代碼&#xff1a; <meta http-equiv"Content-T…