CSSKatas - 交互式 CSS 学习平台

[dsdshcym]

我用过很多交互式的编程学习平台：Leetcode, Codewars, Exercism...
在这些平台上学习新的编程语言、锻炼算法。
读题、编码、提交就能马上得到快速的反馈，学习的同时还能体会到刷题的快感。
但是他们都没有对 CSS 的支持，因此，我正在打造 CSSKatas，一个交互式 CSS 学习平台。

在 MVP 阶段会优先支持 Tailwind CSS，现在已经完成了 3 个 demo。
体验不错的话欢迎订阅 newsletter 跟踪开发进度。
也欢迎在评论里留言反馈 🙏

[ivyliner]

👍

[Xuebaba]

点赞，已经订阅 👍

[SomeBottle]

交互式学习平台大赞👍

[cydian]

非常喜欢。
支持

[GPLer]

其实有类似的平台了，楼主可以去看看 codepip，我体验过的 flexboxfroggy 效果还不错。

[alphardex]

说起交互式学习 freecodecamp 也很赞，我就是靠这个入门的
当然 LZ 的平台也不错，已订阅

[356693212]

https://flexboxzombies.com/p/flexbox-zombies
有一系列的交互式游戏 叫你 css，做的是真的牛皮

[dsdshcym]

@GPLer #5 谢谢推荐！
之前我还真没听说过 Codepip

不过看它的定位更偏向于学生，练习也比较游戏化

我想在 CSSKatas 主推面向实际 Web 开发的练习，游戏性上会差一些，更偏实用、练手向

[dsdshcym]

@alphardex #6 谢谢订阅！

freecodecamp 我一直有看他们的博客

我觉得 CSSKatas 的「练习（ Kata ）」跟这类交互式「教程」的一个区别是：
- freecodecamp 这类教程是有标准答案的（例：这个 h2 tag 里要填上 Hello World ）
- CSSKatas 的练习是没有标准答案的（例：一个 3x3 的布局可以用 flexbox 也可以用 grid ）

我希望 CSSKatas 能通过这些没有标准答案的「练习」让大家相互学习、借鉴，而不仅仅是跟着「教程」走

[dsdshcym]

@356693212 #7 谢谢推荐！

Flexbox Zombies 我也玩过，它也可以算是我做 CSSKatas 的启发之一

我觉得 CSSKatas 跟这类游戏教程的一点是如 #9 里所说的 CSSKatas 没有标准答案

另一点是：
- Flexbox Zombies 的每一个练习更注重一个 CSS 属性（ flex-direction, flex-grow, etc.） 怎么使用
- 而 CSSKatas 更注重实现一个特定的设计，并不关心解决方案里使用了哪些 CSS 属性