提升前端开发技能的最佳途径？那就是实践！动手构建网站，这是最有效的学习方法。如果能从中获得报酬，那就再好不过了；即使是为自身或亲友构建网站，也能显着提升技能。即使只是为了练习而创建项目，也能让你快速成长，这绝对比单纯阅读资料有效得多！

以下是一些资源，它们鼓励你通过构建项目来提升技能：

Frontend Mentor

这个平台最近才上线，也是本文写作的灵感来源。为开发者提供前端项目，本身就是一个成功的商业模式！部分项目免费，部分项目收费。

HackerRank

许多公司也围绕类似的模式构建业务。 HackerRank 主要专注于求职招聘，目标明确，但其提供的技能测试（挑战题）不仅可以评估你的能力，也是宝贵的学习资源。

类似平台还有：Codewars、ChallengeRocket、Codesignal、Topcoder（风险投资家一定很喜欢这种模式）。

Coderbyte

Coderbyte 也提供付费计划，旨在通过挑战题提升你的面试技能。

典型的场景：有时网站是产品，你是客户；有时招聘公司是客户，你是产品。

尝试复现 Dribbble 作品

经典方法：在 Dribbble 上找到你喜欢的作品，尝试复现它。 @keyframers 经常这样做。 Tim Evko 的练习网站过去会为你随机选择 Dribbble 作品（以及 GitHub 问题和编码挑战），但目前 Dribbble 部分似乎已失效，其他功能仍然可用！

Matt Delac 过去也做过类似的系列练习。 Indrek Lasn 也在 Medium 上分享过类似的文章。

Front-End Challenges Club

Andy Bell 曾运营过 Front-End Challenges Club，虽然目前处于暂停状态，但你仍然可以查看其存档。

CodePen Challenges

CodePen 每周都会推出挑战赛，提供主题（以及想法和资源），你可以自由发挥。轻松愉快的挑战。

100 Days of CSS Challenge

Matthias Martin 创建了 100 天 CSS 挑战。所有挑战和参赛作品都公开可见——当然，重点在于你自己尝试完成挑战。

Daily UI

Daily UI 挑战每天都会提供一个新的挑战（免费）。许多人用代码完成这些挑战。

Frontloops

Frontloops 收费 19 美元提供 30 个挑战，包含信息、建议、素材和解决方案。

CSSBattle

如果你喜欢用尽可能少的代码来模仿设计，那么 CSSBattle 会非常适合你。

用尽可能简洁的代码编写程序通常被称为“代码高尔夫”，也有专门的挑战网站。

Ace Front End

Ace Front End 提供的挑战专注于原生 HTML、CSS 和 JavaScript。

我注意到第一个挑战是下拉导航菜单，但它没有处理 aria-expanded 属性。我不确定这有多大问题，也不是要批评 Ace Front End——这只是提醒你，任何挑战都可能存在问题。但这并不意味着你不能从中学习。

Codier

Codier 提供公开的挑战，包括其他用户发布的解决方案。

rendezvous with cassidoo

Cassidy 的每周通讯会在每一期中包含一个挑战。

Rina Diane Caballar 引用 Tim Carry 在《扩展 CSS 的极限》中的话：

Carry 建议从现实世界中的物体入手——例如游戏机的界面或计算器——并尝试仅使用 CSS 来重现它。 “用一种语言突破界限的好方法是创造一些这种语言原本不应该做的事情，”他说。