CSSKatas - 交互式 CSS 学习平台

dsdshcym 10天前 12

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

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

最新回复 (10)
  • ivyliner 6天前
    引用 2
  • Xuebaba 6天前
    引用 3
    点赞,已经订阅
  • SomeBottle 6天前
    引用 4
    交互式学习平台大赞
  • cydian 6天前
    引用 5
    非常喜欢。
    支持
  • GPLer 6天前
    引用 6
    其实有类似的平台了,楼主可以去看看 codepip,我体验过的 flexboxfroggy 效果还不错。
  • alphardex 6天前
    引用 7
    说起交互式学习 freecodecamp 也很赞,我就是靠这个入门的
    当然 LZ 的平台也不错,已订阅
  • 356693212 6天前
    引用 8
    https://flexboxzombies.com/p/flexbox-zombies
    有一系列的交互式游戏 叫你 css,做的是真的牛皮
  • 楼主 dsdshcym 6天前
    引用 9
    @GPLer #5 谢谢推荐!
    之前我还真没听说过 Codepip

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

    我想在 CSSKatas 主推面向实际 Web 开发的练习,游戏性上会差一些,更偏实用、练手向
  • 楼主 dsdshcym 6天前
    引用 10
    @alphardex #6 谢谢订阅!

    freecodecamp 我一直有看他们的博客

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

    我希望 CSSKatas 能通过这些没有标准答案的「练习」让大家相互学习、借鉴,而不仅仅是跟着「教程」走
  • 楼主 dsdshcym 6天前
    引用 11
    @356693212 #7 谢谢推荐!

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

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

    另一点是:
    - Flexbox Zombies 的每一个练习更注重一个 CSS 属性( flex-direction, flex-grow, etc.) 怎么使用
    - 而 CSSKatas 更注重实现一个特定的设计,并不关心解决方案里使用了哪些 CSS 属性
  • 游客
    12
返回