分享一些web前端开发好用的网站

TNTWEB 2021-10-13 11:47:13
前端 javascript css node.js react.js


TNTWeb - 全称腾讯新闻前端团队,组内小伙伴在Web前端、NodeJS开发、UI设计、移动APP等大前端领域都有所实践和积累。

目前团队主要支持腾讯新闻各业务的前端开发,业务开发之余也积累沉淀了一些前端基础设施,赋能业务提效和产品创新。

团队倡导开源共建,拥有各种技术大牛,团队Github地址:https://github.com/tnfe

俗话说的好,磨刀不误砍柴功,了解并收藏一些实用性网站,不管是实例教学的个人博客,还是归纳总结的资源整理,抑或是社区型的大佬云集地,对于我们的web开发来说,都有着事半功倍的效果。

学习先进技术,共同探讨前沿技术,提高自己的内在技术,达到合作共赢。

现在,就让我们一起来看看他们吧。

image.png

一、社区型网站

1.GitHub

(https://github.com/)

GitHub是通过Git进行版本控制的软件源代码托管服务平台。

简单来说,有以下几种功能:代码托管、学习优秀的开源项目、当资料库、多人协作、搭建博客、社交、个人简历、写作等。还有更多功能,等你来发现。

GitHub几乎是所有程序员必备的网站了,不管你从事或者研究的是哪种方向,运用的是哪种语言,GitHub都能给你美好的学习感受。

image.png

2.前端里-专注Web开发技术和资源分享

(https://www.yyyweb.com/)

前端里专注于分享最前沿的web开发技术,教程、资源和素材,是面向网站开发人员和设计师的学习交流平台。

image.png

3.踏得网-沉浸式互联网体验和学习门户

(https://www.techbrood.com/)

领先的沉浸式互联网内容门户,一站式学习、创作和展示。支持中英文双语检索、模糊查询、在线预览和编辑。
里面有很多很酷的动画和特效,总有一款你中意的。

image.png

4.CSS-Tricks

(https://css-tricks.com/)

一个国外的优秀前端开发博客,主要分享使用 CSS 样式的技巧,经验和教程等。值得前端开发者阅读收藏的国外网站。你也可以将自己运用css进行设计的一些心得放上去,和大家一起进行学习借鉴交流。

image.png

5.CSDN-专业开发者社区

(https://www.csdn.net/)

是全球知名中文IT技术交流平台,创建于1999年,包含原创博客、精品问答、职业培训、技术论坛、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区。

(这个是小编当初的的学习启蒙网站,毕竟小编的英文水平也就是just so so,汗颜)

image.png

6.JavaScript Fun - 代码库合集(前端工坊)

(https://www.javascript.fun/)

一个集合当下最流行的 JavaScript 代码库,显示流行排行,开发者可以轻松的找到想要最新的代码插件、工具和博客。

image.png

7.Stack Overflow-编程人员问答网

(https://stackoverflow.com/)

全球IT界最受欢迎的技术问答网站之一,一个解决bug的社区,称为编程界的十万个为什么。

image.png

8.Codrops-网页设计开发博客

(https://tympanus.net/codrops/)

发表技术文章和网页教程,提供经验,少踩坑,资源很丰富,很多优秀的技术都是从这里来的。

image.png

二、工具型网站

1.每周访客报告

(https://t.co/nuLFTvQhcq?amp=1)

一款免费的数据统计工具,可以获取访问您网站的用户数据。

image.png

2.小型开发工具

(https://smalldev.tools/)

麻雀虽小,五脏俱全。一款操作简洁明了的小型开发工具,可以帮助您完成编码、解码、测试等常见任务。

image.png

3.视觉类型量化表

(http://type-scale.com/)

一款可视化在线编辑工具,可以实时编辑样式,预览不同样式之间的差异。

对于css初学者来说,会获得一种视觉直观上的体验,学起来是不是就不那么枯燥乏味了呢。

image.png

4.Responsively

(https://responsively.app/)

有助于加快响应式Web应用程序的开发,是一款高效率工具。

image.png

5.元标签

(http://metatags.io/)

Meta Tags 是一种为任何网站调试和生成元标签代码的工具。您可以编辑和试验您的内容的标签,然后预览您的网页在 Google、Facebook、Twitter 等上的外观!

image.png

6.ReadMe

(https://readme.so/)

在几分钟内直观地创建自述文件的最简单方法。

image.png

7.在线工具

(http://tool.lu/)

里面有很多很有意思的小工具,比如一键抠图、二维码生成、摩斯电码、歇后语、favicon在线制作、颜色转换等,也有可以在线运行代码的工具哦~

image.png

8.阿里巴巴矢量图标库

https://www.iconfont.cn/

iconfont-国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造,设计和前端开发的便捷工具。

(悄咪咪的说一句:小编对这些小小的,萌萌的图案毫无抵抗力)

image.png

三、在线IDE

1. CodePen

(https://codepen.io/)

一个网站前端设计开发平台,针对网站前端代码的一个工具,上面有各种效果的案例特效,可以在他们的demo基础上开发自己的前端设计。

image.png

2. CodeSandBox

(https://codesandbox.io/)

CodeSandBox网站提供一个在线开发环境的“沙盒”,主流的框架如React、Vue、Angular等,都可即开即用、实时编译预览,非常方便。

image.png

3. JS Bin

(https://jsbin.com/?html,output)

一个轻量级在线编辑网站,界面很干净,临时想调试简单的HTML或JS代码可以考虑来这儿试一试。

image.png

当然了,网站在精不在多,找到自己喜欢的、适合自己的,然后熟练掌握并使用,时不时发个自己的技术小心得,学习笔记什么的,不仅可以收获技术上的提升,还能给自己的记忆寻找一个可以存储的宝库,何乐而不为呢。

四、团队

TNTWeb - 腾讯新闻前端团队,TNTWeb致力于行业前沿技术探索和团队成员个人能力提升。为前端开发人员整理出了小程序以及web前端技术领域的最新优质内容,每周更新,欢迎star,github地址:github.com/tnfe/TNT-We…

logo.png

版权声明
本文为[TNTWEB]所创,转载请带上原文链接,感谢
https://segmentfault.com/a/1190000040804708

  1. 五分鐘掌握用Vue脚手架搭建一個完整項目!
  2. ant design vue 設置錶格選擇框,全選按鈕選不全
  3. Cinq minutes pour construire un projet complet avec l'échafaudage vue!
  4. vuex中助手函数的几种使用技巧总结
  5. La nouvelle voiture roule à grande vitesse, le tableau de bord apparaît "tasse de café" prompt, directement au magasin 4S!
  6. Résumé de plusieurs techniques d'utilisation de la fonction Helper dans vuex
  7. Un disciple féminin est venu à guozijian: Zhuo Wenyuan a été complètement noirci, et le frère aîné de sang qi a été blessé par lui!
  8. JavaScript - - quatre façons de juger les types de données
  9. HTTPS|SSL笔记-SSL分手过程(Encrypted Alert)
  10. The film arrangement rate exceeds 40%, and the box office exceeds 390 million in less than two days! Why is Changjin lake?
  11. Nouvelle grande expérience de prise de vue en direct 2022 Geely Howe
  12. Apprenez à connaître CSS - Comment organiser votre code CSS
  13. Can the Zero run C11 with less than 200000 become the leader of medium-sized pure electric SUV?
  14. Https | SSL Notes - SSL break Process (encrypted Alert)
  15. HTTPS|SSL筆記-SSL分手過程(Encrypted Alert)
  16. Récemment, j'a i été interrogé par des fans sur les génériques Java, donc j'ai regardé en arrière et j'espère que l'entrevue de mon frère cadet se passera bien.
  17. Comment utiliser la nouvelle spécification es dans votre projet
  18. JavaScript - - orienté objet
  19. South Korean actress Liu Renna, wearing a white strapless skirt and walking on the red carpet, has a hot body and attracts eyes. She smiles so sweet
  20. Nginx (3): process model
  21. Projet Java: système de gestion du rendement des employés (Java + SSM + MySQL + Maven + HTML)
  22. CSS tips | one line of code to realize the integration of avatar and national flag
  23. Maotai and Paris Fashion Week joined hands to make Chinese elements appear on the show
  24. Wang Xiaoya showed up in a sleeveless skirt and reappeared her intellectual elegance. She was still full of temperament after leaving the nest CCTV
  25. Comment écrire un document de conception frontale
  26. Créer une api javascript haute performance avec Rust et l'exécuter dans webassembly
  27. Analyse de certains principes techniques clés du SDK de surveillance frontale
  28. Point de vue: la NFT de type portrait a formé un modèle d'entreprise. Quelles sont ses perspectives d'avenir et ses difficultés?
  29. Stars celebrate the motherland's birthday in patterns: Tang Yan Bixin, Liu Xiaoqing in military uniform, Zhao Liying and he Jiong send blessings
  30. L'amour entre Wing Mei et Luan Tree: de l'amour à première vue à l'amour éternel
  31. Disappeared car companies: tape measure is useless? Zhongtai is on the verge of death and has no way to return to heaven
  32. BUUCTF [极客大挑战 2019]Http
  33. element缓存到本地使用
  34. How can the volunteer army with less steel and more gas beat the American army with more steel and less gas? Changjin Lake gives you the answer
  35. CentOS installation source package nginx error
  36. Mise en cache des éléments pour utilisation locale
  37. Disappeared car companies: tape measure is useless? Zhongtai is on the verge of death and has no way to return to heaven
  38. He saifei est si naturel!58 ans est si beau, porter des vêtements de vieillesse pour accepter de vieillir!
  39. Finally pregnant! Seven years of pregnancy, collective blessing of the entertainment industry
  40. Wu Qili sent blessings on the national day. She looked haggard and thin on her own. It was worrying
  41. Error in spring source code compilation: the monoprocessor in reactor.core.publisher is outdated
  42. Buctf [geek Challenge 2019] http
  43. 20 个值得学习的 Vue 开源项目
  44. 20 projets open source à apprendre
  45. Scène et application de la manette des gaz anti - bavardage
  46. Qu'est - ce que j'ai gagné en abandonnant vue pour les six mois de React?
  47. À partir de [Bytecode cache] et de [http cache], intervieweur: « est - ce si mince? »
  48. [niveau intermédiaire et avancé] obligatoire, 30 + questions manuscrites à haute fréquence et réponses détaillées (dix mille caractères longs), voyez comment "vous" ne pouvez pas m'abattre
  49. Mise en œuvre d'un outil d'échafaudage universel pour l'ingénierie Web de 0 à 1
  50. 【中高级前端】必备,30+高频手写题及详细答案(万字长文),看“你”怎么难倒我
  51. In less than two days, the box office exceeded 400 million, and Changjin Lake broke out, breaking seven records in Chinese film history
  52. Tong Liya Jin Chen bumps her hair, Xie Na Zhao Liying bumps her shirt, and she sees EQ from the reaction
  53. react之组件生命周期
  54. L'équipe de vue dévoile un nouvel outil d'échafaudage rapide comme la foudre Create View, qui remplacera la vue CLI à l'avenir, avec seulement 300 lignes de code, apprenez - le!
  55. 20 dessins illustrant le fonctionnement du moteur de rendu du Navigateur
  56. In less than two days, the box office exceeded 400 million, and Changjin Lake broke out, breaking seven records in Chinese film history
  57. 千锋重庆web前端学习之理解CSS位置属性
  58. 什么是语义HTML标记以及如何使用它们?
  59. Si vous vous représentez avec un tableau, c'est le champ de Van Gogh.
  60. 前端面试手写代码