哈哈,網際網路圈本週的大事件是微信公眾號關閉 iOS 平臺打賞入口,討論這件事情的文章很多,前端週刊就沒有收錄相關文章。另外 JS Conf China 2017 已經開始報名,定於 7月 15 日在上海舉行,早鳥票已售罄,想去的抓緊時間報名。
回到技術本身,我讀到 3 篇非常不錯的如何寫出更簡潔程式碼的文章:縮排就是複雜性、去掉迴圈、寫的更少,不論是初入門的新人還是中高階工程師都建議閱讀。好了,下面是本週精選的內容,React Native 比重較大,請享用。
文章教程
箭頭函式你需要知道的都在這兒了
箭頭函式是 ES6 中的新特性,讓函式程式碼更簡潔,箭頭函式本身沒有繫結執行上下文,引數等等。很多時候,我們犯了錯誤才會明白“動手之前要先去看文件”,MDN 上關於箭頭函式文件非常詳細,關於哪裡能用,哪裡不能用,都解釋的很詳細,如果你就生在 ES6 的環境,這個必須得仔細看。
寫給略懂 jQuery 同學的 Vue.js 入門教程
jQuery 在前端領域的地位就像是 Web Server 領域的 Apache,據統計現在全球有 70% 的網站都引用了 jQuery,技術在進步,如果你只是略懂 jQuery 想學 Vue.js 咋辦?學習新東西的最大障礙就是思維方式的轉變,閱讀這篇文章看看學會 Vue.js 接受哪些新的思考方式。
通過案例學會 React Native Navigator 原理及用法
React Native 入門的時候,腦子裡面肯定很多疑問,React Native 裡面是否有類似於 React Router 的東西?如果有怎麼用?React Native 內建的 Navigator 就是用來幹這個的,方便你開發多頁面的 APP,這篇文章從最簡單的例子開始教你如何使用 Navigator、傳遞引數、配置轉場動畫。
管理 React Native 應用樣式的幾點建議
入手 React Native 開發的同學有沒有糾結過應用的樣式程式碼到底該放到哪裡?是單獨抽出來,還是全部內聯?共享的樣式怎麼辦?實際上沒有標準的做法,這篇文章會給你一些建議,讓你的程式碼更好管理。
如何使用 HTTP Headers 來保護你的 Web 應用?
無論是簡單的小網頁還是複雜的單頁應用,Web 應用都是網路攻擊的目標。開發者可以利用 HTTP 響應頭來加強 Web 應用程式的安全性,通常只需要新增幾行程式碼即可。本文將介紹 web 開發者如何利用 HTTP Headers 來構建安全的應用。雖然本文的示例程式碼是 Node.js,但基本所有主流的服務端語言都支援設定 HTTP 響應頭,並且都可以簡單地對其進行配置。
大資料浪潮下的前端工程師
把前端工程師放在產業發展、技術進步的大背景下來審視,前端工程師不應該僅僅關注實現介面和互動,非常建議閱讀,不多做解釋。
前端精讀評論:前後端渲染之爭
十年前,幾乎所有網站都使用 ASP、Java、PHP 這類做後端渲染,但後來隨著 Angular、React、Vue 等 JS 框架的崛起,開始轉向了前端渲染。從 2014 年起又開始流行了同構渲染,號稱是未來,整合了前後端渲染的優點,但轉眼間三年過去了,很多當時壯心滿滿的框架(Rendlr、Lazo)從先驅變成了先烈。同構到底是不是未來?自己的專案該如何選型?建議閱讀
開發工具
httpie: 比 curl 和 wget 更好用的網路工具
httpie 是一款比 curl 和 wget 更好用的網路請求命令列工具,Egghead.io 上還有一門介紹 http 基礎知識的免費課程全程就是用的這個工具,你看了這個課程 httpie 的用法和 http 基礎都學會了,注意這個工具的讀法是 “愛吃提提派”,而不是“愛吃踢踢屁愛意”。
awaiting:async/await 輔助工具庫
awaiting 是基於 async/await 特性的工具庫,提供了常見的延時、等待,以及 Promise 相關的工具函式,想學好 async/await?看看先行者拿他做了啥會學的更快。
程式碼框架
React Navigation:可擴充套件且易用的路由解決方案
看了上面的 Navigator 文章,覺得他很難用,現在來看看 React Navigation,可擴充套件但非常易用的路由解決方案,由 Facebook、Expo、React 社群的共同努力演化而來,甚至可以用在 React 專案中。
Split.js:輕量的檢視分隔 JS 外掛
Split.js 是一款輕量級的檢視(皮膚)分隔外掛,無任何外部依賴,對 HTML 的書寫也沒有特別的規定,只需要分隔的皮膚有相同的父節點。支援橫向、縱向分割,相鄰的皮膚中間自動給加上了可拖拽的分割線。
找找靈感
Froggy:玩兒遊戲學會 Flexbox
這樣說吧,Flexbox 對佈局帶來的便利只有學會的人能真正體會到,這個 24 關的小遊戲,通過靈活運用 Flexbox 把青蛙放到正確的位置,助你掌握 Flexbox 裡面的各種屬性用途、用法。
漫畫賞析:Linux 核心到底長啥樣
這篇文章為大家解讀來自 TurnOff.us 的漫畫 “InSide The Linux Kernel” ,非常形象有趣。TurnOff.us 是一個極客漫畫網站,作者 Daniel Stori 畫了一些非常有趣的關於程式語言、Web、雲端計算、Linux 相關的漫畫。
視訊教程
Egghead.io:Redux 入門教程
任何應用的狀態管理都是至關重要的,Redux 被部分同學誤解為是給 React 應用使用的狀態管理工具,實際上他可以應用到更廣義的 JS 應用中,本視訊教程由 Redux 的作者(那個讓 HMR(模組熱更新)成為前端開發標配的男人)親自錄製,免費開放到了 Egghead.io 上,想學的趕緊去。
JS 驅動網站的 SEO 最佳實踐
來自 Google 的工程師 John Mueller,跟大家分享現代網站(主要指大量使用 JS 網站) SEO 最佳實踐,澄清了社群中關於 JS 網站 SEO 的一些認識誤區,並給了不少有用的建議,需翻牆。
One More Thing
本文作者王仕軍,商業轉載請聯絡作者獲得授權,非商業轉載請註明出處。如果你覺得本文對你有幫助,請點贊!如果對文中的內容有任何疑問,歡迎留言討論。想知道我接下來會寫些什麼?歡迎訂閱我的掘金專欄。