Skip to content

就是去做:a sample todolist web-app written by plain JavaScript

License

Notifications You must be signed in to change notification settings

RayJune/JustToDo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

e4ede98 · May 10, 2018
Feb 13, 2018
Mar 25, 2018
Feb 12, 2018
Mar 25, 2018
Jan 22, 2018
Feb 11, 2018
Jan 24, 2018
Dec 21, 2017
Jan 26, 2018
Aug 21, 2017
Feb 13, 2018
Dec 10, 2017
May 10, 2018
Mar 17, 2018
Feb 12, 2018
Mar 17, 2018

Repository files navigation

一个基于 indexedDB、plain JavaScript 实现的 toDoList web-app

就是去做

首页

首页

添加 item

todolist

随机名言警句

随机名言警句

针对 mobile 进行优化

mobile 1

mobile 2

主要功能

  • 使用 indexedDB 提供存储 todolist item 和随机出现的名言警句(用自己的 indexeddb-crud npm package 来操作 indexedDB)
  • 如果用户的浏览器不支持 indexedDB 则自动转换为 without indexedDB mode(这部分代码利用 lazy load 的方式来加载
  • 列表 item 为空则随机出现名言警句

branch 状况

  • gh-pages 放置最新代码的更新(默认分支,可运行)
  • dev 放置测试代码的更新(不一定可运行)
  • ES5 分支放置 ES5 的代码实现(我不会告诉你前 109 次 commit 都是纯 ES5 写的 :》)

punchline

  • 不借助任何库(包括 JQuery),基于 plain JavaScript 的代码实现(约 1k 行历经多次重构的 JavaScript,前期用 ES5,后期用 ES6 重写,分离出了 ES5 分支来记录老版代码)
  • 将操作 indexedDB 的代码部分独立抽出成为一个 npm package,并发布在 npmjs.com 上(用以解决这一类问题):https://www.npmjs.com/package/indexeddb-crud
  • 选择使用 npm scripts 配合 browserify 进行模块化打包
  • 使用 handlebars 将 view 和 data 分离,提高代码可维护性,提高页面渲染速度
  • 统一的代码风格(ESlint, AirBnB),代码品味(体现在每一行代码的处理中)

页面设计理念

整体样式模仿于前端观察

感谢

参考/模仿了两位 first commit 的代码,向两位表示感谢:)

About

就是去做:a sample todolist web-app written by plain JavaScript

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published