時光飛逝,雖然國慶長假已經結束,但七天的假期根本表達不完我們對祖國的熱愛。新時代的首次閱兵、首次亮相的新型武器、受閱軍人的著裝與精神風貌,除了久久不能忘懷,更感受到了偉大祖國的繁榮富強。有國才有家,只有國家強大,我們才能擁有更多的獲得感與幸福感。不忘初心,砥礪前行,繼續努力吧,IT 人!
熱血過後,還要回到現實,一起來看看《開源精粹》第六期的內容。在本期中,你將會發現一些實用的庫、工具和框架,例如百度開源的 NoahV,HTML 模板庫------ lit-html,或是 Google 開源的 Jib,都會給你帶來不少的幫助。話不多說,先睹為快吧!
前端1.Maizzle
Maizzle 是一個 HTML 電子郵件框架,能夠幫助你快速製作 HTML 電子郵件原型。你不需要學習特定的語法,只需要正常編寫 HTML 即可。由於框架核心不存在硬編碼元件,所以它可以實現更大的靈活,程式碼也具備可移植性。
專案地址:
https://github.com/maizzle/maizzle
2.Choices.js
Choices.js 是一個可定製的 JS 選擇框/文字輸入外掛,與 Select2 和 Selectize 類似,但不依賴 jQuery.
專案地址:
https://github.com/jshjohnson/Choices
3.Balloon.css
Balloon.css 是一個純 CSS 實現的簡易工具提示框。僅通過數行 CSS 程式碼,就可以實現不同位置的提示效果。
專案地址:
https://github.com/kazzkiq/balloon.css
4.v-region
v-region 是一款基於 Vue 2.0 的中國行政區劃選擇器。它提供了 4 級行政區域可供選擇,即可選擇 "省/直轄市"、"市"、"區/縣"、"鄉/鎮/街道" 。同時,它具備多種顯示模式(純文字、表單元素、下拉選擇器)。
專案地址:
https://github.com/TerryZ/v-region
5.NoahV
這是一個由百度開源的基於 Vue 的前端應用框架。它除了具備豐富的常用元件外,還提供了一系列實用的研發輔助功能(API 資料模擬、資料儀表盤、腳手架),適用於監控運維、資料分析等場景,以及常見的後臺管理系統。
專案地址:
https://github.com/baidu/NoahV
6.lit-html
lit-html 是一款簡單、高效、可擴充套件的 HTML 頁面模板庫。它幫助你實現在 JS 中編寫 HTML 模版,同時完全支援 JS 與函數語言程式設計。
專案地址:
https://github.com/polymer/lit-html
後端1.Jib
這是 Google 開源的容器映象構建工具,幫助你將應用打包到容器映象過程中的所有步驟,它直接與 Maven 和 Gradle Java 開發環境整合,不需要你編寫 Dockerfile 或安裝 Docker ,只需將其作為外掛新增到你的構建中,就可以將 Java 應用容器化。
專案地址:
https://github.com/GoogleContainerTools/jib
2.Bokeh
Bokeh 是一個互動式、視覺化的 Python 庫,它能夠幫助你在 WEB 瀏覽器上快速地展示、建立互動式的圖表、控制面板、資料應用以及產品原型。
專案地址:
https://github.com/bokeh/bokeh
3.Crawlab
Crawlab 是一個基於 Golang 的分散式爬蟲管理平臺,支援 Python、NodeJS、Go、Java、PHP 等多種程式語言以及多種爬蟲框架。
專案地址:
https://github.com/crawlab-team/crawlab
4.30-seconds-of-python
30-seconds-of-python 是一個優質的 Python 學習資源,旨在幫助大家通過 30 秒 Get 到實用的 Python 程式設計技巧,內容分為了 List、Math、Object、String、Utility 等五大板塊,相信對你的提高會有所幫助。
專案地址:
https://github.com/30-seconds/30-seconds-of-python
移動端1.Makeup
這是一個用 Canvas 給人臉化妝的 App 演示專案,支援美白、磨皮、脣彩、美瞳、瘦臉、豐胸、大長腿等功能。
專案地址:
https://github.com/DingProg/Makeup
2.Flutter-Go
Flutter Go 是阿里巴巴開源的一款 Flutter 開發者幫助 App. 它包含了 Flutter 常用 140+ 元件的演示與中文文件,幫助開發者搞定所有常用 widget 的用法。目前 Android 和 iOS 正式版都已上架。
專案地址:
https://github.com/alibaba/flutter-go
3.Beeshell
Beeshell 是一個由美團開源的 React Native 基礎元件庫,它提供了一整套開箱即用的高品質元件,包含 JS 元件和複合元件,涉及 FE、iOS、Android 三端技術,支援自定義主題,用於開發和服務企業級移動應用。
專案地址:
https://github.com/Meituan-Dianping/beeshell
4.Best-Flutter-UI-Templates
一套非常精緻的 Flutter UI 模版,供你免費使用。
專案地址:
https://github.com/mitesh77/Best-Flutter-UI-Templates
工具/資源1.Gita
Gita 是一個管理多個 git 倉庫的命令列工具,可以在任意目錄下檢視倉庫狀態,或者執行 git 命令。
工具地址:
https://github.com/nosarthur/gita
2.learn-regex
這是一個實用的正則表示式學習資源,從基礎概念到用法練習,幫助你快速掌握正則表示式。
工具地址:
https://github.com/ziishaned/learn-regex
3.Research
Research 是一個快捷的搜尋工具。它整合了百度、微博、知乎、微信、語雀、京東等眾多常用的搜尋引擎,你只需要輸入一次關鍵詞,就可以在不同的搜尋引擎中檢視搜尋結果,非常方便。
工具地址:
https://github.com/ifrontend-xyz/research
4.VS Code LeetCode
在 VS Code 中練習 LeetCode 的外掛。刷題必備,速速安裝吧!
工具地址:
https://github.com/jdneo/vscode-leetcode
5.Awesome UIKit
Awesome UIKit 是一個開源專案,旨在收集 JS 框架、Web 元件庫和管理模板。看看,有木有你需要的模版。
專案地址:
https://github.com/jaywcjlove/awesome-uikit
6.Codelf
Phil Karlton 曾說"在 CS 領域中,有兩件事是非常難的,一個是快取失效,一個是命名。"可見給變數或函式命名,對於程式設計師來說多麼痛苦,而 Codelf 就是應運而生變數命名神器。它支援主流程式語言,以及中文混合搜尋,助你擺脫變數命名的困擾。
專案地址:
https://unbug.github.io/codelf/
設計1.西田影象
眼界與靈感指引著設計師的行為,而尋找靈感,提升眼界最簡單的辦法就是多看、多思考。今天分享的西田影象網站,就是一個基於 CC0 協議的高品質免版權的圖片素材網站。它提供了 6 大分類,6 種圖片尺寸供你免費使用。
網站地址:
https://www.sitapix.com
2.imglarger
這是一個基於機器學習與人工智慧技術實現圖片無損放大的線上工具。它操作簡單,只需上傳原始圖片,選擇提交的形式以及放大倍數即可。通過預覽放大的圖片,直接就可以免費儲存了。
網站地址:
https://imglarger.com/Tw/
3.Image Finder
Image Finder最初是一個基於 Flickr 的圖片搜尋引擎。經過多年的發展,成為了一個遵循 CC0 協議的共享影象下載網站,所以個人、商業均可免費使用。與其他相簿不同的是,網站中的所有影象均屬於原始攝影師,它會引導使用者到原圖片網站上進行下載,但下載過程並不繁瑣。
目前,網站上展示了 23 萬+ 高品質的影象素材,你可以通過顏色、標籤、熱門程度進行快速查詢,非常方便。
網站地址:
https://imagefinder.co
4.Mixkit Art
在《開源精粹》第五期中,我給大家推薦了一個高品質的免費視訊素材網站------ Mixkit,今天分享的 Mixkit Art,就是 Mixkit 下的一個分類,但兩個網站的型別卻截然不同。
Mixkit Art 專注於收錄精美的插畫和藝術圖案,內容涉及城市、慶典、動物、飲食、自然等眾多分類。雖然,網站上的圖片數量不是特別多,但如果尋找靈感的話,同樣也可以來看看,並且所有的圖片也支援商業或非商業使用。
網站地址:
https://mixkit.co/art/
程式設計靈感1.Order confirm animation
酷炫的訂單確定動畫效果。
檢視原始碼:
https://codepen.io/aaroniker/pen/eYOVrNa
2.Animated chat bar interaction
Chat Bar 互動動畫示例。
檢視原始碼:
https://codepen.io/kylewetton/pen/zYOzXxp
3.Flipping card effect
CSS 實現卡片翻轉效果。
檢視原始碼:
https://codepen.io/JeremyWink/pen/oNvybqX
4.Modern Gradient Buttons
CSS 實現漂亮的漸變色 Buttons 合集。
檢視原始碼:
https://codepen.io/TheCSSKing/pen/abowMLW
5.CSS Card Hover Effects
CSS 實現卡片 Hover 效果。
檢視原始碼:
https://codepen.io/Jhonierpc/pen/MWgBJpy
彩蛋12306 購票助手------py12306
隨著國家鐵路運輸的發展,人們生活水平的提高,出行變得越來越方便,但隨之而來的購票問題,卻令人相當的頭痛。每逢節假日,票總是難搶的一批。這不,py12306 便因此而誕生了。
這是一個基於 Python 開發的 12306 購票助手,它具備分散式、多賬號、多工的特性,支援 Web 頁面管理,同時也支援釘釘、微信以及郵箱通知,不僅可以查票,也可以直接下單買票。
專案地址:
https://github.com/pjialin/py12306
趣圖1.當寫的程式,出現 bug 的時候....
2.二進位制世界的神奇!
3.硬核演示結對程式設計
4.總算找到了孤立 Python 的理由了!
5.作為一個開發員,你的優缺點是什麼?
注:
原文地址:
https://zhuanlan.zhihu.com/p/86707646