前言:
最近在GitHub上发现了一个vanillawebprojects[1]开源仓库,里面收集了 20 个JavaScript+Html+CSS的练手项目,没有使用任何框架,可以让你从基础入门到深入学习。这些项目原本是Udemy上20 Web Projects With Vanilla JavaScript课程的一部分,但是如果你已经拥有了一些基础,不妨试着看一下源码,然后模仿实现吧
1. Form Validator 表单验证
判断输入的表单字段是否合法
2. Movie Seat Booking 预定电影座位
一个简单的电影座位预定演示项目
3. Custom Video Player 定制视频播放器
一个简单的网页视频播放器
4. Exchange Rate Calculator 汇率计算器
计算不同货币的兑换汇率
5. DOM Array Methods Project DOM 数组方法
练习如何操作 DOM 数组
6. Menu Slider & Modal 动态菜单以及弹窗
练习如何弹出登录注册窗口,以及滑动弹出菜单
7. Hangman Game 字符侦探游戏
练习如何判断隐藏字符是否正确
8. Mealfinder App 点餐应用
简单的点餐查询应用
9. Expense Tracker 购物结算应用
简单的购物车结算应用
10. Music Player 音乐播放器
简单的网页音乐播放器
11. Infinite Scrolling 网页无限滚动演示
网页无限向下滚动实现
12. Typing Game 打字游戏
简单的打字输入游戏
13. Speech Text Reader 文本阅读器
文本阅读器
14. Memory Cards 记忆卡片
测试记忆的记忆卡片
15. LyricsSearch App 歌词搜索应用
网页歌词搜索器
16. Relaxer App 休闲呼吸应用
模拟呼吸的节奏
17. Breakout Game 弹跳破冰游戏
简单的网页破冰游戏
18. New Year Countdown 新年倒计时
网页新年倒计时
19. Sortable List 榜单应用
网页财富榜单
20. Speak Number Guessing Game 猜数字游戏
说出数字,猜测数字
今天我们给大家分享了,20 个JavaScript+Html+CSS练手小项目,大家觉得哪个最简单,哪个最复杂呢?赶紧去 Github 仓库拉取项目,码上行动吧
欢迎关注公众号:KnowHub 知识加油站!
参考资料
[1]
vanillawebprojects:/bradtraversy/vanillawebprojects