搜尋
首頁web前端js教程【前端必備】16個實用工具/網站分享
【前端必備】16個實用工具/網站分享Oct 10, 2022 pm 07:04 PM
vuejavascriptweb前端前端

【前端必備】16個實用工具/網站分享

推薦16個前端必備的實用工具與網站。總結分享一些日常工作中比較實用的軟體和網站,這些網站你平時工作中大概率是會用到的,感覺不錯的話可以點讚收藏

1. GitHub Desktop

#對於新手來說,要記住這麼多git指令可能有點困難,建議新手用git視覺化工具,會方便很多

【前端必備】16個實用工具/網站分享

2. 圖片線上壓縮

tinypng 是一個完全免費且高壓縮率的線上壓縮圖片網站,一般能滿足日常大部分壓縮圖片的需求,如果你需要壓縮大於5M的圖片,可以考慮用squoosh ,這個網站支援大圖片壓縮和圖片壓縮品質自訂

【前端必備】16個實用工具/網站分享

大圖片壓縮點這裡:squoosh

2-【前端必備】16個實用工具/網站分享

3. 線上程式碼編輯

##很多人可能用的是

codePenCodeSandbox 等,但是我覺得掘金的碼上掘金也挺好用的,並且登入自己的掘金帳號就能看到,挺方便的

【前端必備】16個實用工具/網站分享

4.

JSON格式化

JSON線上格式化的網站有很多,基本上都能滿足我們的需要,用

Json.cn 的原因只是因為他好記,哈哈~

【前端必備】16個實用工具/網站分享

另外還有個前端工具類別集合的網站

smalldev 也挺好用的

5.

程式碼產生圖片

carbon 可以產生酷炫的程式碼片段,並且支援匯出圖片

【前端必備】16個實用工具/網站分享

#如果你不喜歡上面的程式碼風格,也可以用

ray.so ,產生的程式碼圖如下:

5-【前端必備】16個實用工具/網站分享

6 .

表情符號

這個網站有很多顏文字,並且可以直接cv,國內外很多博客用的都是這上面的表情符號

【前端必備】16個實用工具/網站分享

7.

向量圖標-iconfont

阿里阿巴巴推出的字體圖標庫,可以找到大部分的圖標,並且可以結合項目去自定義自己項目的字體圖示庫

【前端必備】16個實用工具/網站分享

8.

css3動畫

我們在日常開發中,會遇到一些css動畫的需求,可是有時候為了一兩個動畫引入一些函式庫感覺得不償失,

css3-animation 包含了一些常見的動畫效果,並且包含片段程式碼,直接cv就可以了

【前端必備】16個實用工具/網站分享

8-【前端必備】16個實用工具/網站分享

9. 封面模板-canva

我們在寫文章或有時候要自己製作一些封面圖片,canva上面有很多免費的素材和模板,用起來很方便

【前端必備】16個實用工具/網站分享

10. 高清圖片-UnSplash

國外的一個高清圖片下載網站,裡面有很多的4k高清圖片免費下載,再也不用到處找高清圖片了

【前端必備】16個實用工具/網站分享

#11. 線上畫圖

日常工作中我們要畫一些流程圖或心智圖等等,boardmix 個人用起來感覺還不錯,也有人喜歡用ProcessOn等,看個人喜好

1【前端必備】16個實用工具/網站分享

12. 快速部署建站

前端有時候需要自己部署一個網站,我們可以自己去買伺服器,也有免費的部署網站,如surge

1【前端必備】16個實用工具/網站分享

13. 線上效能評測

pagespeed 根據各項指標可以得出我們網站的一個綜合評分,讓我們知道我們的網站在那些方面還可以進行優化

1【前端必備】16個實用工具/網站分享

14. 多平台測試

我們的網站常常要在各種設備下看下效果,可是用手機和瀏覽器去一個個訪問截圖又比較麻煩,responsively 這個軟體支援主流手機、PAD、電腦設備造訪您的網站,並可以匯出

1【前端必備】16個實用工具/網站分享

15. Chrome擴充元件

有些同學不能翻牆登入google帳號去Google商店下載擴展程序,極簡插件 可以不翻牆直接下載Google擴展程序,而且網站是中文的,感覺很不錯

1【前端必備】16個實用工具/網站分享

16. 線上履歷

履歷這個東西找工作大家都是要用到的,網路上也有很多免費的履歷模板網站,個人推薦這個500丁網站,上面有很多好看的履歷模板,很方便
ps:這個網站是收費的,不過永久會員39.9還行,不用擔心過期,畢竟用到不止一次(如果實在不想花39.9,可以找我要下哈~)

1【前端必備】16個實用工具/網站分享

#上面就是和大家分享的平時日常工作中比較實用的一些工具和網站,如果感覺對你有用的話可以收藏一下。

【相關推薦:web前端開發

#

以上是【前端必備】16個實用工具/網站分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文轉載於:掘金社区。如有侵權,請聯絡admin@php.cn刪除
es6数组怎么去掉重复并且重新排序es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM

去掉重复并排序的方法:1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句,去掉数组中的重复元素,返回去重后的新数组;2、利用sort()对去重数组进行排序,语法“去重数组.sort()”。

JavaScript的Symbol类型、隐藏属性及全局注册表详解JavaScript的Symbol类型、隐藏属性及全局注册表详解Jun 02, 2022 am 11:50 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题,包括了Symbol类型的描述、Symbol不会隐式转字符串等问题,下面一起来看一下,希望对大家有帮助。

原来利用纯CSS也能实现文字轮播与图片轮播!原来利用纯CSS也能实现文字轮播与图片轮播!Jun 10, 2022 pm 01:00 PM

怎么制作文字轮播与图片轮播?大家第一想到的是不是利用js,其实利用纯CSS也能实现文字轮播与图片轮播,下面来看看实现方法,希望对大家有所帮助!

JavaScript对象的构造函数和new操作符(实例详解)JavaScript对象的构造函数和new操作符(实例详解)May 10, 2022 pm 06:16 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于对象的构造函数和new操作符,构造函数是所有对象的成员方法中,最早被调用的那个,下面一起来看一下吧,希望对大家有帮助。

javascript怎么移除元素点击事件javascript怎么移除元素点击事件Apr 11, 2022 pm 04:51 PM

方法:1、利用“点击元素对象.unbind("click");”方法,该方法可以移除被选元素的事件处理程序;2、利用“点击元素对象.off("click");”方法,该方法可以移除通过on()方法添加的事件处理程序。

JavaScript面向对象详细解析之属性描述符JavaScript面向对象详细解析之属性描述符May 27, 2022 pm 05:29 PM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于面向对象的相关问题,包括了属性描述符、数据描述符、存取描述符等等内容,下面一起来看一下,希望对大家有帮助。

foreach是es6里的吗foreach是es6里的吗May 05, 2022 pm 05:59 PM

foreach不是es6的方法。foreach是es3中一个遍历数组的方法,可以调用数组的每个元素,并将元素传给回调函数进行处理,语法“array.forEach(function(当前元素,索引,数组){...})”;该方法不处理空数组。

整理总结JavaScript常见的BOM操作整理总结JavaScript常见的BOM操作Jun 01, 2022 am 11:43 AM

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于BOM操作的相关问题,包括了window对象的常见事件、JavaScript执行机制等等相关内容,下面一起来看一下,希望对大家有帮助。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。