https://github.com/AlexisDanizan/Checklist-Tools-Website
🍿 The perfect Checklist Website for meticulous developers.
https://github.com/AlexisDanizan/Checklist-Tools-Website
api checklist checklist-application css fluid-interface front-end-development frontend frontend-app guidelines gulp html javascript localstorage reference ressources security security-tools web-development web-development-tools
Last synced: 7 months ago
JSON representation
🍿 The perfect Checklist Website for meticulous developers.
- Host: GitHub
- URL: https://github.com/AlexisDanizan/Checklist-Tools-Website
- Owner: AlexisDanizan
- License: apache-2.0
- Created: 2018-01-29T14:56:52.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2019-05-09T20:17:55.000Z (over 6 years ago)
- Last Synced: 2024-10-31T08:39:33.792Z (12 months ago)
- Topics: api, checklist, checklist-application, css, fluid-interface, front-end-development, frontend, frontend-app, guidelines, gulp, html, javascript, localstorage, reference, ressources, security, security-tools, web-development, web-development-tools
- Language: JavaScript
- Homepage: https://alexisdanizan.github.io
- Size: 1.26 MB
- Stars: 99
- Watchers: 6
- Forks: 19
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
🍿 Checklist Tools Website
A user-friendly and fluid interface for using checklists.
[](https://github.com/AlexisDanizan/Checklist-Tools-Website/blob/master/LICENSE)
[](https://github.com/thedaviddias/Front-End-Checklist/)
[](https://github.com/AlexisDanizan/Checklist-Tools-Website/issues)
[](https://github.com/AlexisDanizan/Checklist-Tools-Website/stargazers)
[](https://twitter.com/intent/tweet?text=Wow:&url=https%3A%2F%2Fgithub.com%2FAlexisDanizan%2FChecklist-Tools-Website)
**All the power of checklists, without the overhead:**
- User-friendly and fluid interface
- Fast build with [Preact]() and [Milligram](https://github.com/milligram/milligram)
- Generate PDF report
- Offline checklists storage with LocalStorage
- Auto-save your progress 🚀
- 💥 **Instant no-config app bundling**
Based on checklists:
- [Front-End Checklist](https://github.com/thedaviddias/Front-End-Checklist)
- [Search Engine Optimization](https://github.com/marcobiedermann/search-engine-optimization)
- [API Security Checklist](https://github.com/shieldfy/API-Security-Checklist)
- [The Side Project Marketing Checklist](https://github.com/karllhughes/side-project-marketing)
### Use the online version: [alexisdanizan.github.io](https://alexisdanizan.github.io)
## Installation
**Install with npm**
```bash
npm i checklist-tools-website
```
**Install with Yarn**
```bash
yarn add checklist-tools-website
```
**Install manually**
```bash
git clone https://github.com/AlexisDanizan/Checklist-Tools-Website.git
yarn install
# or
npm install
```
## How to use ?
**Build with [Gulp](https://github.com/gulpjs/gulp)**
```bash
gulp build
```
Built files are available in `dist` folder.
## Customize
**Build and serve files with [Gulp](https://github.com/gulpjs/gulp)**
```bash
gulp build
gulp webserver
```
The version is available at [http://localhost:8080](http://localhost:8080)
### Add a new Checklist
#### Use the auto-converter
To convert a checklist to markdown format you can use the `bin/mdChecklistToJson.js` script.
To do this, add your checklist in `sample.md` and run the command **`npm mdtojson`**.
The result of the conversion is in **`bin/sample.json`**. Modify your checklist until you get the result.
#### Add manually
Create a new json files in `src/checklist`.
Sample template:
```json
{
"name": "Front-dev",
"group_categories": [
{
"title_group": "Head",
"categories": [
{
"title": "Meta tags",
"tasks": [
{
"title": "Doctype",
"links": [
{"path":"https://www.w3.org/TR/html5/syntax.html#determining-the-character-encoding",
"text":"Determining the character encoding - HTML5 W3C",
"type": "link"}
],
"explications":"The Doctype is HTML5 and is at the top of all your HTML pages.",
"code":" ",
"priority": "high"
}
]
}
]
}
]
}
```
To make the checklist available in app you need to modify `src/stores/checklistStore.js`
and add `import example from '../checklist/example.json';`.
Next add it in INITIAL_DATA:
```js
const INITIAL_DATA = {
checklists: [
example
],
...
};
```
## Troubleshooting
The new checklist does not appear in select:
- Empty the localstorage before add a new checklist.
## Contributing
**Open an issue or a pull request to suggest changes or additions.**
### Guide
The **Checklist Tools Website** repository consists of two branches:
#### 1. `master`
This branch consists of the current stable branchof [Checklist Tools Website](https://github.com/AlexisDanizan/Checklist-Tools-Website).
#### 2. `develop`
This branch will be used to make some significant changes to the structure, content if needed. It is preferable to use the master branch to fix small errors or add a new checklist.
## Support
If you have any question or suggestion, don't hesitate to use Twitter:
* [Twitter](https://twitter.com/alexisdanizan)
## Author
**[Alexis Danizan](https://github.com/AlexisDanizan)**
## Contributors
This project exists thanks to all the people who contribute.
## License
Designed and created with ♥ by Danizan Alexis. Licensed under the [Apache 2.0 License](https://www.apache.org/licenses/LICENSE-2.0).