├── web ├── CHANGELOG.md ├── .nvmrc ├── .babelrc ├── src │ ├── views │ │ ├── mixins │ │ │ ├── mixins.pug │ │ │ ├── m-icon.pug │ │ │ └── m-checklist-section.pug │ │ ├── components │ │ │ ├── c-sponsor.pug │ │ │ ├── c-top-alert.pug │ │ │ ├── c-search.pug │ │ │ ├── c-progress.pug │ │ │ ├── svg │ │ │ │ ├── bullet.pug │ │ │ │ ├── checkbox.pug │ │ │ │ ├── collapse.pug │ │ │ │ ├── expand.pug │ │ │ │ ├── arrow.pug │ │ │ │ ├── check.pug │ │ │ │ ├── checked.pug │ │ │ │ ├── eye.pug │ │ │ │ ├── code.pug │ │ │ │ ├── print.pug │ │ │ │ └── reset.pug │ │ │ ├── c-nav.pug │ │ │ ├── checklist │ │ │ │ ├── checkbox.pug │ │ │ │ ├── dropdown.pug │ │ │ │ ├── priority.pug │ │ │ │ ├── class.pug │ │ │ │ └── label.pug │ │ │ ├── s-section-top.pug │ │ │ ├── s-section-bottom.pug │ │ │ ├── c-tools.pug │ │ │ ├── c-new-form.pug │ │ │ ├── c-newsletter.pug │ │ │ ├── c-corner.pug │ │ │ ├── c-tag-filter.pug │ │ │ ├── c-notation.pug │ │ │ └── c-checklist.pug │ │ ├── base │ │ │ ├── header.pug │ │ │ ├── after-scripts.pug │ │ │ ├── footer.pug │ │ │ └── layout.pug │ │ └── index-en.pug │ ├── favicon.ico │ ├── favicon-16x16.png │ ├── favicon-32x32.png │ ├── img │ │ ├── icons │ │ │ └── 1x1.png │ │ ├── logos │ │ │ ├── logo-front-end-checklist.jpg │ │ │ └── logo-front-end-checklist.webp │ │ ├── banners │ │ │ ├── logo-front-end-checklist.jpg │ │ │ ├── front-end-checklist-banner-dark.jpg │ │ │ └── front-end-checklist-banner-light.jpg │ │ └── flags │ │ │ ├── ru.svg │ │ │ ├── fr.svg │ │ │ ├── jp.svg │ │ │ ├── vn.svg │ │ │ ├── tr.svg │ │ │ ├── cn.svg │ │ │ └── kr.svg │ ├── mstile-150x150.png │ ├── robots.txt │ ├── apple-touch-icon.png │ ├── styles │ │ ├── base │ │ │ ├── _typography.scss │ │ │ ├── _media.scss │ │ │ ├── _headings.scss │ │ │ ├── _form.scss │ │ │ ├── _generic.scss │ │ │ ├── _fonts.scss │ │ │ ├── _links.scss │ │ │ ├── _print.scss │ │ │ └── _icons.scss │ │ ├── utilities │ │ │ ├── functions │ │ │ │ └── _functions.scss │ │ │ ├── _utilities.scss │ │ │ └── mixins │ │ │ │ ├── _mixins.scss │ │ │ │ └── _m-breakpoints.scss │ │ ├── components │ │ │ ├── _c-sponsor.scss │ │ │ ├── _c-dropdown.scss │ │ │ ├── _c-tools.scss │ │ │ ├── _c-top-alert.scss │ │ │ ├── _c-tags.scss │ │ │ ├── _c-github.scss │ │ │ ├── _c-progress.scss │ │ │ ├── _c-notation.scss │ │ │ ├── _c-newsletter.scss │ │ │ ├── _c-list.scss │ │ │ ├── _c-nav.scss │ │ │ └── _c-button.scss │ │ ├── config │ │ │ ├── _variables.scss │ │ │ ├── _v-namespaces.scss │ │ │ ├── _v-typography.scss │ │ │ └── _v-colors.scss │ │ ├── layout │ │ │ ├── _s-footer.scss │ │ │ ├── _page.scss │ │ │ ├── _s-main.scss │ │ │ ├── _s-checklist.scss │ │ │ ├── _s-aside.scss │ │ │ └── _s-header.scss │ │ └── main.scss │ ├── android-chrome-192x192.png │ ├── scripts │ │ ├── main.js │ │ ├── components │ │ │ ├── Analytics.js │ │ │ ├── Notation.js │ │ │ ├── Filter.js │ │ │ ├── ProgressBar.js │ │ │ ├── Report.js │ │ │ ├── Init.js │ │ │ ├── Ui.js │ │ │ ├── Dropdown.js │ │ │ ├── Checkboxes.js │ │ │ └── Tools.js │ │ └── Utils.js │ ├── browserconfig.xml │ ├── humans.txt │ ├── sitemap.xml │ ├── manifest.json │ ├── _headers │ ├── safari-pinned-tab.svg │ ├── service-worker.js │ ├── precache-config.js │ └── modernizr-custom.min.js ├── data │ ├── jp │ │ ├── project │ │ │ ├── introductions.json │ │ │ └── translation.json │ │ ├── _items.json │ │ ├── items │ │ │ └── 利用方法.json │ │ └── _project.json │ └── en │ │ ├── project │ │ ├── introductions.json │ │ └── translation.json │ │ ├── items │ │ ├── domain.json │ │ ├── process.json │ │ ├── people.json │ │ └── technology.json │ │ ├── _items.json │ │ └── _project.json ├── test │ ├── notation.test.js │ ├── localstorage.test.js │ └── reports.test.js ├── .github │ ├── ISSUE_TEMPLATE.md │ ├── stale.yml │ ├── PULL_REQUEST_TEMPLATE.md │ └── CONTRIBUTING.md ├── README.md ├── .editorconfig ├── .prettierrc ├── wallaby.js ├── .codeclimate.yml ├── .gitignore ├── modernizr-config.json ├── .travis.yml ├── webpack.config.js ├── .stylelintrc ├── .eslintrc.js ├── package.json └── CODE_OF_CONDUCT.md ├── _config.yml ├── docs └── adr │ ├── README.md │ ├── 0001-前端展示页面.md │ └── 0001-frontend-page.md ├── .editorconfig ├── LICENSE ├── .gitignore └── rating ├── assets ├── canvas-to-blob.min.js └── FileSaver.min.js ├── index.html └── src ├── main.js └── utils.js /web/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /web/.nvmrc: -------------------------------------------------------------------------------- 1 | 8.12.0 2 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | remote_theme: phodal/mifa-jekyll 2 | 3 | -------------------------------------------------------------------------------- /web/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["env"] 3 | } 4 | -------------------------------------------------------------------------------- /web/src/views/mixins/mixins.pug: -------------------------------------------------------------------------------- 1 | include m-checklist-section 2 | include m-icon 3 | -------------------------------------------------------------------------------- /web/src/views/components/c-sponsor.pug: -------------------------------------------------------------------------------- 1 | .c-sponsor 2 | .cs__wrapper 3 | #codefund_ad 4 | -------------------------------------------------------------------------------- /docs/adr/README.md: -------------------------------------------------------------------------------- 1 | # Architecture Decision Records 2 | 3 | * [1. frontend-page](0001-frontend-page.md) -------------------------------------------------------------------------------- /web/data/jp/project/introductions.json: -------------------------------------------------------------------------------- 1 | [{ 2 | "head": { 3 | "introduction": "" 4 | } 5 | }] 6 | -------------------------------------------------------------------------------- /web/src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/favicon.ico -------------------------------------------------------------------------------- /web/test/notation.test.js: -------------------------------------------------------------------------------- 1 | let expect = require('chai').expect; 2 | let assert = require('assert'); 3 | -------------------------------------------------------------------------------- /web/test/localstorage.test.js: -------------------------------------------------------------------------------- 1 | let expect = require('chai').expect; 2 | let assert = require('assert'); 3 | -------------------------------------------------------------------------------- /web/src/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/favicon-16x16.png -------------------------------------------------------------------------------- /web/src/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/favicon-32x32.png -------------------------------------------------------------------------------- /web/src/img/icons/1x1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/icons/1x1.png -------------------------------------------------------------------------------- /web/src/mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/mstile-150x150.png -------------------------------------------------------------------------------- /web/src/robots.txt: -------------------------------------------------------------------------------- 1 | # www.robotstxt.org/ 2 | 3 | # Allow crawling of all content 4 | User-agent: * 5 | Disallow: 6 | -------------------------------------------------------------------------------- /web/src/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/apple-touch-icon.png -------------------------------------------------------------------------------- /web/src/styles/base/_typography.scss: -------------------------------------------------------------------------------- 1 | p { 2 | font-size: 1.2rem; 3 | line-height: 1.5; 4 | margin-top: 0; 5 | } 6 | -------------------------------------------------------------------------------- /web/src/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/android-chrome-192x192.png -------------------------------------------------------------------------------- /web/src/views/components/c-top-alert.pug: -------------------------------------------------------------------------------- 1 | .c-top-alert 2 | .c-top-alert--alert 3 | p= translation.alert.JAVASCRIPT_DESACTIVATE 4 | -------------------------------------------------------------------------------- /web/data/en/project/introductions.json: -------------------------------------------------------------------------------- 1 | [{ 2 | "head": { 3 | "introduction": "" 4 | }, 5 | "html": { 6 | "introduction": "" 7 | } 8 | }] 9 | -------------------------------------------------------------------------------- /web/src/img/logos/logo-front-end-checklist.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/logos/logo-front-end-checklist.jpg -------------------------------------------------------------------------------- /web/src/img/logos/logo-front-end-checklist.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/logos/logo-front-end-checklist.webp -------------------------------------------------------------------------------- /web/src/img/banners/logo-front-end-checklist.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/banners/logo-front-end-checklist.jpg -------------------------------------------------------------------------------- /web/src/scripts/main.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | import Init from './components/Init'; 4 | 5 | document.addEventListener('DOMContentLoaded', () => new Init()); 6 | -------------------------------------------------------------------------------- /web/.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /web/src/img/banners/front-end-checklist-banner-dark.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/banners/front-end-checklist-banner-dark.jpg -------------------------------------------------------------------------------- /web/src/img/banners/front-end-checklist-banner-light.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/phodal/new-project-checklist/HEAD/web/src/img/banners/front-end-checklist-banner-light.jpg -------------------------------------------------------------------------------- /web/README.md: -------------------------------------------------------------------------------- 1 | # New Project Chechlists in Web 2 | 3 | Web based on [https://github.com/thedaviddias/Front-End-Checklist](https://github.com/thedaviddias/Front-End-Checklist) 4 | 5 | -------------------------------------------------------------------------------- /web/src/styles/utilities/functions/_functions.scss: -------------------------------------------------------------------------------- 1 | // Function to choose colors in CSS variables 2 | @function color($color-name) { 3 | @return var(--color-#{$color-name}); 4 | } 5 | -------------------------------------------------------------------------------- /web/src/styles/components/_c-sponsor.scss: -------------------------------------------------------------------------------- 1 | .c-sponsor { 2 | width: 100%; 3 | } 4 | 5 | .cs { 6 | &__wrapper { 7 | min-width: 320px; 8 | overflow: hidden; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /web/src/views/components/c-search.pug: -------------------------------------------------------------------------------- 1 | .c-search 2 | .form 3 | .form-group 4 | input.search(type="search" id="search") 5 | label(for="search")= translation.form.LABEL_SEARCH 6 | -------------------------------------------------------------------------------- /web/src/styles/utilities/_utilities.scss: -------------------------------------------------------------------------------- 1 | 2 | main [data-body-visibility='hide'] * { 3 | display: none; 4 | } 5 | 6 | 7 | [data-body-visbility='hide'] { 8 | display: none; 9 | } 10 | 11 | -------------------------------------------------------------------------------- /web/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /web/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "flow", 3 | "useTabs": false, 4 | "printWidth": 80, 5 | "tabWidth": 2, 6 | "singleQuote": true, 7 | "trailingComma": "all", 8 | "bracketSpacing": false 9 | } 10 | -------------------------------------------------------------------------------- /web/wallaby.js: -------------------------------------------------------------------------------- 1 | 2 | module.exports = function (wallaby) { 3 | return { 4 | files: [ 5 | './src/scripts/**/*.js' 6 | ], 7 | 8 | tests: [ 9 | 'test/**/*.js' 10 | ] 11 | }; 12 | }; 13 | -------------------------------------------------------------------------------- /web/src/views/components/c-progress.pug: -------------------------------------------------------------------------------- 1 | .c-progress 2 | progress.c-progress__bar.js-progress(value="0", max="100") 3 | .c-progress__counter 4 | span.c-progress__label 0 % 5 | span.c-progress__text  #[=sectionTitle] #[=translation.PERCENTAGE_CHECKED] 6 | -------------------------------------------------------------------------------- /web/src/views/components/svg/bullet.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 510 510" aria-hidden="true")&attributes(attributes) 2 | path(d="M255 0C114.75 0 0 114.75 0 255s114.75 255 255 255 255-114.75 255-255S395.25 0 255 0z") 3 | -------------------------------------------------------------------------------- /web/src/styles/components/_c-dropdown.scss: -------------------------------------------------------------------------------- 1 | @if $use-dropdown == true { 2 | [data-item-dropdown='open'] .c-checklist__details { 3 | display: block; 4 | } 5 | 6 | [data-item-dropdown='close'] .c-checklist__details { 7 | display: none; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /web/src/views/components/svg/checkbox.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns="http://www.w3.org/2000/svg" width='30', height='30' viewBox="0 0 94 94" aria-hidden="true")&attributes(attributes) 2 | path(d="M94 88c0 3.312-2.688 6-6 6H6c-3.314 0-6-2.688-6-6V6c0-3.313 2.686-6 6-6h82c3.312 0 6 2.687 6 6v82z") 3 | -------------------------------------------------------------------------------- /web/src/styles/components/_c-tools.scss: -------------------------------------------------------------------------------- 1 | .c-tools { 2 | display: flex; 3 | 4 | @include mq('print') { 5 | display: none; 6 | } 7 | 8 | .is-active { 9 | border-color: #415257; 10 | } 11 | 12 | .c-button__group:first-child { 13 | margin-left: 0; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /web/src/views/components/c-nav.pug: -------------------------------------------------------------------------------- 1 | nav.c-nav 2 | ul.c-nav__list.c-nav--inline 3 | 4 | each item, i in listSections 5 | li.c-nav__item 6 | a.c-button.js-scroll(href=`#section-${item}`) 7 | span.c-nav__status(id=`js-nav-${item}`, data-notation="0") 8 | span= item 9 | -------------------------------------------------------------------------------- /web/src/browserconfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | #da532c 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /web/.codeclimate.yml: -------------------------------------------------------------------------------- 1 | --- 2 | engines: 3 | eslint: 4 | enabled: true 5 | channel: eslint-3 6 | stylelint: 7 | enabled: true 8 | ratings: 9 | paths: 10 | - src/** 11 | - "**.scss" 12 | - "**.js" 13 | exclude_paths: 14 | - "test" 15 | - "data" 16 | - "dist" 17 | - "gulpfile.babel.js" 18 | -------------------------------------------------------------------------------- /web/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | npm-debug.log* 4 | yarn-debug.log* 5 | yarn-error.log* 6 | test/unit/coverage 7 | test/e2e/reports 8 | selenium-debug.log 9 | dist/ 10 | .tmp/ 11 | 12 | # Editor directories and files 13 | .idea 14 | .vscode 15 | *.suo 16 | *.ntvs* 17 | *.njsproj 18 | *.sln 19 | -------------------------------------------------------------------------------- /web/src/styles/config/_variables.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Spacing 3 | // 4 | $spacing-super: 24px !default; 5 | $spacing-xlarge: 18px !default; 6 | $spacing-large: 16px !default; 7 | $spacing-medium: 14px !default; 8 | $spacing-small: .7px !default; 9 | $spacing-xsmall: 3px !default; 10 | $spacing-tiny: 1px !default; 11 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /web/test/reports.test.js: -------------------------------------------------------------------------------- 1 | const chai = require('chai'); 2 | const assert = chai.assert; // Using Assert style 3 | const expect = chai.expect; // Using Expect style 4 | const should = chai.should(); // Using Should style 5 | 6 | const sinon = require('sinon'); 7 | const EventEmitter = require('events').EventEmitter; 8 | -------------------------------------------------------------------------------- /web/src/views/components/svg/collapse.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30', viewbox='0 0 510 510' aria-hidden="true")&attributes(attributes) 2 | title Minus Collapse 3 | path(d='M255 0C114.75 0 0 114.75 0 255s114.75 255 255 255 255-114.75 255-255S395.25 0 255 0zm127.5 280.5h-255v-51h255v51z') 4 | -------------------------------------------------------------------------------- /web/src/humans.txt: -------------------------------------------------------------------------------- 1 | # humanstxt.org/ 2 | # The humans responsible & technology colophon 3 | 4 | # TEAM 5 | 6 | David Dias -- Front-End Developer -- @thedaviddias 7 | 8 | # THANKS 9 | 10 | 11 | 12 | # TECHNOLOGY COLOPHON 13 | 14 | CSS3, HTML5, Pug, Git, ES6, Webpack, Gulp, Modernizr, Normalize.css 15 | -------------------------------------------------------------------------------- /web/modernizr-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "minify": true, 3 | "options": [ 4 | "domPrefixes", 5 | "prefixes", 6 | "mq", 7 | "prefixedCSSValue", 8 | "testStyles", 9 | "setClasses" 10 | ], 11 | "feature-detects": [ 12 | "test/history", 13 | "test/css/flexbox", 14 | "test/workers/webworkers" 15 | ] 16 | } 17 | -------------------------------------------------------------------------------- /web/src/views/components/checklist/checkbox.pug: -------------------------------------------------------------------------------- 1 | .c-checklist__column.c-checklist__checkbox 2 | input.checkbox(type="checkbox" name=`c-checklist__item-${sectionTitle.toLowerCase()}-${i}` id=`c-checklist__item-${sectionTitle.toLowerCase()}-${i}`) 3 | +svg-icon.icon.icon-checkbox(data-icon-name='check') 4 | +svg-icon.icon.icon-checked(data-icon-name='check') 5 | -------------------------------------------------------------------------------- /web/src/img/flags/ru.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /web/src/img/flags/fr.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /web/src/styles/utilities/mixins/_mixins.scss: -------------------------------------------------------------------------------- 1 | @import 'm-breakpoints'; 2 | 3 | @mixin unselectable { 4 | -webkit-touch-callout: none; 5 | -webkit-user-select: none; 6 | -moz-user-select: none; 7 | -ms-user-select: none; 8 | user-select: none; 9 | } 10 | 11 | ol, 12 | ul { 13 | list-style: none; 14 | } 15 | 16 | .sr-only { 17 | display: none; 18 | } 19 | -------------------------------------------------------------------------------- /docs/adr/0001-前端展示页面.md: -------------------------------------------------------------------------------- 1 | # 1. Frontend Page 2 | 3 | Date: 2019-03-05 4 | 5 | ## Status 6 | 7 | 2019-03-05 proposed 8 | 9 | ## Context 10 | 11 | A webpage will help user to do this. 12 | 13 | such as: 14 | 15 | - https://github.com/thedaviddias/Front-End-Checklist 16 | 17 | ## Decision 18 | 19 | Decision here... 20 | 21 | ## Consequences 22 | 23 | Consequences here... 24 | -------------------------------------------------------------------------------- /docs/adr/0001-frontend-page.md: -------------------------------------------------------------------------------- 1 | # 1. Frontend Page 2 | 3 | Date: 2019-03-05 4 | 5 | ## Status 6 | 7 | 2019-03-05 proposed 8 | 9 | ## Context 10 | 11 | A webpage will help user to do this. 12 | 13 | such as: 14 | 15 | - https://github.com/thedaviddias/Front-End-Checklist 16 | 17 | ## Decision 18 | 19 | Decision here... 20 | 21 | ## Consequences 22 | 23 | Consequences here... 24 | -------------------------------------------------------------------------------- /web/src/sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | https://phodal.github.io/new-project-checklist/ 5 | 6 | 7 | -------------------------------------------------------------------------------- /web/src/views/components/checklist/dropdown.pug: -------------------------------------------------------------------------------- 1 | .c-checklist__column.c-checklist__dropdown 2 | 3 | //- Check if the item has content, if not hide the button 4 | if item.tools || item.documentation || item.code || item.subitems 5 | button.button-icon.js-dropdown.c-checklist__dropdown__button(aria-label="Open the description section") 6 | +svg-icon.icon.icon-arrow(data-icon-name='arrow') 7 | -------------------------------------------------------------------------------- /web/data/jp/_items.json: -------------------------------------------------------------------------------- 1 | {"利用方法":[{"title":"Doctype","priority":"High","description":"The Doctype is HTML5 and is at the top of all your HTML pages.","code":"https://gist.github.com/thedaviddias/bccee9f4dfa728830cf38bb83838d2d3.js","documentation":[{"title":"Determining the character encoding - HTML5 W3C","url":"https://www.w3.org/TR/html5/syntax.html#determining-the-character-encoding"}],"tags":["all","Meta tag"]}]} -------------------------------------------------------------------------------- /web/src/views/components/svg/expand.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30', viewbox='0 0 510 510' aria-hidden="true")&attributes(attributes) 2 | title Plus Expand 3 | path(d='M280.5 127.5h-51v102h-102v51h102v102h51v-102h102v-51h-102v-102zM255 0C114.75 0 0 114.75 0 255s114.75 255 255 255 255-114.75 255-255S395.25 0 255 0zm0 459c-112.2 0-204-91.8-204-204S142.8 51 255 51s204 91.8 204 204-91.8 204-204 204z') 4 | -------------------------------------------------------------------------------- /web/src/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "NP Checklist", 3 | "name": "New Project Checklist", 4 | "start_url": "https://phodal.github.io/new-project-checklist/", 5 | "icons": [ 6 | { 7 | "src": "android-chrome-192x192.png", 8 | "sizes": "192x192", 9 | "type": "image/png" 10 | } 11 | ], 12 | "theme_color": "#ffffff", 13 | "background_color": "#ffffff", 14 | "display": "standalone" 15 | } 16 | -------------------------------------------------------------------------------- /web/src/views/components/svg/arrow.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns="http://www.w3.org/2000/svg" width='30', height='30' viewBox="0 0 98.148 98.149" aria-hidden="true")&attributes(attributes) 2 | title Arrow 3 | path(d="M97.562 64.692L50.49 17.618c-.75-.75-2.078-.75-2.828 0L.586 64.693C.21 65.068 0 65.577 0 66.106c0 .53.21 1.04.586 1.414l12.987 12.987c.39.39.902.586 1.414.586.512 0 1.023-.195 1.414-.586l32.675-32.674L81.75 80.506c.75.75 2.078.75 2.828 0L97.562 67.52c.782-.78.782-2.048 0-2.828z") 4 | -------------------------------------------------------------------------------- /web/src/styles/base/_media.scss: -------------------------------------------------------------------------------- 1 | .media { 2 | align-items: flex-start; 3 | display: flex; 4 | text-align: left; 5 | } 6 | 7 | .img-logo { 8 | width: 85px; 9 | height: 85px; 10 | 11 | @include mq('handheld-and-up') { 12 | width: 100px; 13 | height: 100px; 14 | } 15 | } 16 | 17 | // frameborder="0" 18 | // allowtransparency="true" 19 | // scrolling="no" 20 | iframe { 21 | background: transparent; 22 | margin: 0; 23 | padding: 0; 24 | border: 0; 25 | } 26 | -------------------------------------------------------------------------------- /web/src/views/base/header.pug: -------------------------------------------------------------------------------- 1 | header.s-header 2 | 3 | include ../components/c-corner 4 | 5 | .s-header__banner 6 | .text-center 7 | h1.font-weight-bold= translation.SITE_NAME 8 | p.sub-heading= translation.SITE_TAGLINE 9 | 10 | //- Add new language manually 11 | //.s-header__lang 12 | // ul.s-header__lang__list 13 | // li.s-header__lang__item 14 | // a(href="/") 15 | // img(src="/img/flags/en.svg" width="20" height="15" alt="English language") 16 | -------------------------------------------------------------------------------- /web/src/styles/components/_c-top-alert.scss: -------------------------------------------------------------------------------- 1 | @if $use-top-alert == true { 2 | #{$namespace-top-alert} { 3 | display: none; 4 | 5 | .no-js & { 6 | &--alert { 7 | min-height: 35px; 8 | background: orange; 9 | width: 100%; 10 | text-align: center; 11 | font-weight: bold; 12 | color: white; 13 | font-size: 1.3rem; 14 | padding: 5px 0; 15 | 16 | p { 17 | margin: 0; 18 | } 19 | } 20 | } 21 | } 22 | } 23 | 24 | -------------------------------------------------------------------------------- /web/src/views/components/checklist/priority.pug: -------------------------------------------------------------------------------- 1 | .c-checklist__column.c-checklist__priority 2 | 3 | if item.priority == "High" 4 | +svg-icon.icon.icon--small.icon-priority--high(aria-label="High priority item" data-icon-name='bullet') 5 | 6 | else if item.priority == "Medium" 7 | +svg-icon.icon.icon--small.icon-priority--medium(aria-label="Medium priority item" data-icon-name='bullet') 8 | 9 | else 10 | +svg-icon.icon.icon--small.icon-priority--low(aria-label="Low priority item", data-icon-name='bullet') 11 | -------------------------------------------------------------------------------- /web/src/views/components/svg/check.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30' viewbox='-432 234 94 94' aria-hidden="true")&attributes(attributes) 2 | title Check 3 | path(d='M-349 245v72h-72v-72h72m5-11h-82c-3.3 0-6 2.7-6 6v82c0 3.3 2.7 6 6 6h82c3.3 0 6-2.7 6-6v-82c0-3.3-2.7-6-6-6z') 4 | path.path-check(d='M-349.2 261.1l-7.2-7.2c-.8-.8-2-.8-2.8 0l-37.3 37.3-13.3-13.3c-.8-.8-2-.8-2.8 0l-7.2 7.2c-.4.4-.6.9-.6 1.4s.2 1 .6 1.4l21.9 21.9c.4.4.9.6 1.4.6.5 0 1-.2 1.4-.6l45.9-45.9c.4-.4.6-.9.6-1.4 0-.5-.2-1-.6-1.4z') 5 | -------------------------------------------------------------------------------- /web/.github/stale.yml: -------------------------------------------------------------------------------- 1 | daysUntilStale: 60 2 | daysUntilClose: 15 3 | exemptLabels: 4 | - pinned 5 | - security 6 | staleLabel: wontfix 7 | markComment: > 8 | This issue has been automatically marked as stale because it has not had 9 | recent activity. It will be closed if no further activity occurs. If you have any question, please contact me directly at thedaviddias@gmail.com. Thank you 10 | for your contributions to that project! 11 | # Comment to post when closing a stale issue. Set to `false` to disable 12 | closeComment: false 13 | -------------------------------------------------------------------------------- /web/data/jp/items/利用方法.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "title": "Doctype", 4 | "priority": "High", 5 | "description": "The Doctype is HTML5 and is at the top of all your HTML pages.", 6 | "code": "https://gist.github.com/thedaviddias/bccee9f4dfa728830cf38bb83838d2d3.js", 7 | "documentation": [ 8 | { 9 | "title": "Determining the character encoding - HTML5 W3C", 10 | "url": "https://www.w3.org/TR/html5/syntax.html#determining-the-character-encoding" 11 | } 12 | ], 13 | "tags": ["all", "Meta tag"] 14 | } 15 | ] 16 | -------------------------------------------------------------------------------- /web/src/styles/components/_c-tags.scss: -------------------------------------------------------------------------------- 1 | .c-tags { 2 | &__list { 3 | padding: 0; 4 | list-style: none; 5 | position: relative; 6 | opacity: .7; 7 | 8 | [data-item-check='true'] & { 9 | opacity: .2; 10 | } 11 | } 12 | 13 | &__item { 14 | font-size: 1rem; 15 | display: inline; 16 | padding: 3px; 17 | white-space: nowrap; 18 | opacity: 1; 19 | overflow: hidden; 20 | border: .5px solid $border; 21 | 22 | @include mq('handheld-and-up') { 23 | font-size: 11px; 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /web/src/views/components/svg/checked.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns="http://www.w3.org/2000/svg" width='30', height='30' viewBox="0 0 330 330" aria-hidden="true")&attributes(attributes) 2 | path(d="M315 0H15C6.716 0 0 6.716 0 15v300c0 8.284 6.716 15 15 15h300c8.284 0 15-6.716 15-15V15c0-8.284-6.716-15-15-15zm-49.394 107.796l-135.62 135.62c-2.813 2.814-6.63 4.394-10.606 4.394-3.98 0-7.794-1.58-10.607-4.393l-44.38-44.38c-5.858-5.86-5.858-15.356 0-21.214 5.858-5.857 15.354-5.857 21.214 0l33.772 33.774L244.393 86.583c5.857-5.858 15.355-5.858 21.213 0 5.858 5.857 5.858 15.355 0 21.213z") 3 | -------------------------------------------------------------------------------- /web/src/views/components/s-section-top.pug: -------------------------------------------------------------------------------- 1 | //- List of all sections in the order the mixin +section is called in the article section. 2 | //- Array is populate by 3 | - listSections = [] 4 | 5 | //- Ids of each section generated by the mixin +section when called. 6 | - listSectionId = [] 7 | 8 | //- Section with Ad and search (TODO: to enable after first launch) 9 | .s-main__section.s-main__meta 10 | 11 | include c-sponsor 12 | //- include c-search 13 | 14 | //- Section with tag filter 15 | .s-main__section.s-main__filter 16 | 17 | include c-tag-filter 18 | -------------------------------------------------------------------------------- /web/.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | sudo: false 3 | node_js: 4 | - "8.12.0" 5 | cache: 6 | directories: 7 | - node_modules 8 | before_install: 9 | - npm i -g npm@latest 10 | install: 11 | - npm install 12 | script: 13 | - gulp build 14 | notifications: 15 | email: 16 | recipients: 17 | - thedaviddias@gmail.com 18 | branches: 19 | only: 20 | - master 21 | - /^greenkeeper/.*$/ 22 | deploy: 23 | local_dir: dist 24 | provider: pages 25 | skip_cleanup: true 26 | github_token: $GITHUB_TOKEN 27 | on: 28 | branch: master 29 | -------------------------------------------------------------------------------- /web/src/views/base/after-scripts.pug: -------------------------------------------------------------------------------- 1 | script(src="scripts/app.bundle.js" async) 2 | script. 3 | 4 | if ('serviceWorker' in navigator) { 5 | //- console.log('CLIENT: service worker registration in progress.'); 6 | navigator.serviceWorker.register('service-worker.js').then(function() { 7 | //- console.log('CLIENT: service worker registration complete.'); 8 | }, function() { 9 | //- console.log('CLIENT: service worker registration failure.'); 10 | }); 11 | } 12 | else { 13 | //- console.log('CLIENT: service worker is not supported.'); 14 | } 15 | -------------------------------------------------------------------------------- /web/src/img/flags/jp.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /web/src/styles/layout/_s-footer.scss: -------------------------------------------------------------------------------- 1 | .s-footer { 2 | display: grid; 3 | text-align: center; 4 | padding: 20px; 5 | 6 | @include mq(lap-and-up) { 7 | padding: 50px 0; 8 | } 9 | 10 | @include mq('print') { 11 | padding: 10px; 12 | } 13 | 14 | &__badges { 15 | @include mq('print') { 16 | display: none; 17 | } 18 | } 19 | 20 | &__grateful { 21 | @include mq('print') { 22 | display: none; 23 | } 24 | } 25 | 26 | &__made { 27 | font-size: 1.4rem; 28 | 29 | @include mq('print') { 30 | font-size: 7pt; 31 | } 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /web/src/_headers: -------------------------------------------------------------------------------- 1 | /* 2 | X-Frame-Options: DENY 3 | X-XSS-Protection: 1; mode=block 4 | # Prevent browsers from incorrectly detecting non-scripts as scripts 5 | X-Content-Type-Options: nosniff 6 | # Don't load any resource type not explicitly enabled 7 | # Disable plugins like Flash or Silverlight 8 | # Load images, scripts, stylesheets and fonts from self 9 | # Send reports to report-uri.io 10 | # Content-Security-Policy: default-src 'self'; object-src 'none'; img-src https:; script-src https: www.google-analytics.com ajax.googleapis.com buttons.github.io; style-src https: ; font-src https: ; 11 | -------------------------------------------------------------------------------- /web/src/img/flags/vn.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /web/webpack.config.js: -------------------------------------------------------------------------------- 1 | const webpack = require('webpack'); 2 | const path = require('path'); 3 | 4 | const mainPath = path.resolve(__dirname, 'src/scripts', 'main.js'); 5 | const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); 6 | 7 | module.exports = { 8 | cache: true, 9 | mode: 'production', 10 | entry: { 11 | app: mainPath 12 | }, 13 | output: { 14 | filename: '[name].bundle.js', 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.js$/, 20 | exclude: /node_modules/, 21 | loader: 'babel-loader' 22 | } 23 | ] 24 | }, 25 | optimization: { 26 | minimize: true 27 | } 28 | }; 29 | -------------------------------------------------------------------------------- /web/.stylelintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "stylelint-config-standard", 3 | "plugins": [ 4 | "stylelint-scss" 5 | ], 6 | "rules": { 7 | "at-rule-no-unknown": null, 8 | "color-named": [ 9 | "always-where-possible", 10 | ignore: ["inside-function"] 11 | ], 12 | "max-empty-lines": 4, 13 | "string-quotes": "single", 14 | "color-hex-length": "long", 15 | "declaration-colon-newline-after": null, 16 | "font-family-name-quotes": null, 17 | "number-leading-zero": "never", 18 | "value-list-comma-newline-after": null, 19 | "max-nesting-depth": 3, 20 | "unit-whitelist": ['%', 'px', 'rem', 's', 'deg', 'ms', 'fr', 'pt'], 21 | "no-descending-specificity": null 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /web/src/img/flags/tr.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /web/src/views/components/checklist/class.pug: -------------------------------------------------------------------------------- 1 | - allClass = '' 2 | - dataItemDropdown 3 | - priorityClass = item.priority.toLowerCase() 4 | 5 | //- Iteration over tags array 6 | each tag in item.tags 7 | 8 | //- Create an empty array to put all values from tags array 9 | - var tempClass = [] 10 | 11 | //- Slip and add a dash if the tag is more than 1 word 12 | - tag = tag.toLowerCase().split(' ').join('-') 13 | 14 | //- Push array value into tempClass array 15 | - tempClass.push(tag) 16 | 17 | - for (var i = 0; i < tempClass.length; i++) 18 | - allClass += tempClass[i] + ' '; 19 | 20 | if item.tools || item.documentation || item.code || item.video 21 | - dataItemDropdown = "open" 22 | else 23 | - dataItemDropdown = "false" 24 | -------------------------------------------------------------------------------- /web/src/views/components/svg/eye.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30' viewbox='-430 231.5 98.5 98.5' aria-hidden="true")&attributes(attributes) 2 | path(d='M-332.8 277.3c-.9-1-21.5-24.9-48-24.9-26.4 0-47.1 23.9-48 24.9-1.7 2-1.7 4.9 0 6.9.9 1 21.5 24.9 48 24.9 26.4 0 47.1-23.9 48-24.9 1.7-2 1.7-4.9 0-6.9zm-39.9-10.6c1.8-1 4.3.1 5.5 2.5 1.3 2.3.9 5-.9 6s-4.3-.1-5.5-2.5c-1.3-2.3-.9-5 .9-6zm-8.1 33.8c-18.5 0-34-14.2-39.4-19.7 3.6-3.8 11.9-11.4 22.6-16-2.1 3.2-3.3 6.9-3.3 11 0 11.1 9 20.1 20.1 20.1s20.1-9 20.1-20.1c0-4.1-1.2-7.9-3.3-11 10.7 4.6 18.9 12.3 22.6 16-5.4 5.5-20.9 19.7-39.4 19.7z') 3 | path(d='M-349.675 239.41l8.202 8.202-74.245 74.246-8.202-8.203z') 4 | path.st0(d='M-416.16 322.39l75.095-75.093 3.465 3.465-75.094 75.094z') 5 | title Eye 6 | -------------------------------------------------------------------------------- /web/src/scripts/components/Analytics.js: -------------------------------------------------------------------------------- 1 | let instance = null; 2 | /** 3 | * 4 | * 5 | * @class Analytics 6 | */ 7 | class Analytics { 8 | constructor() { 9 | if (!instance) { 10 | instance = this; 11 | } 12 | 13 | return instance; 14 | } 15 | 16 | addRef() { 17 | const details = document.querySelectorAll('.js-details'); 18 | 19 | details.forEach(detail => { 20 | const links = detail.querySelectorAll('a'); 21 | links.forEach(link => { 22 | link.setAttribute('href', link.href + '?ref=frontendchecklist'); 23 | }); 24 | }); 25 | } 26 | 27 | enableAnalytics() { 28 | instance.addRef(); 29 | } 30 | } 31 | 32 | const Instance = new Analytics(); 33 | Object.freeze(Instance); 34 | export default Analytics; 35 | -------------------------------------------------------------------------------- /web/src/views/components/s-section-bottom.pug: -------------------------------------------------------------------------------- 1 | .s-main__section.s-main__newsletter 2 | 3 | //include c-newsletter 4 | 5 | //- Form and navigation anchors 6 | //- Navigation is at the bottom of the page because of the `listSections` generated by each +section present in the article. 7 | header.s-main__section.s-main__header 8 | 9 | .s-header__checklist 10 | 11 | h2.s-header__checklist__title Report and navigation 12 | //- Form to create new checklist 13 | .s-header__checklist__el 14 | include c-new-form 15 | 16 | //- Navigation with anchors based on the sections 17 | .s-header__checklist__el 18 | include c-nav 19 | 20 | //- Letter notation based on number of items checked 21 | .s-header__checklist__el 22 | include c-notation 23 | -------------------------------------------------------------------------------- /web/src/views/base/footer.pug: -------------------------------------------------------------------------------- 1 | footer.page-footer 2 | .s-footer 3 | 4 | .s-footer__grateful 5 | 6 | p Icons made by #[a(href='http://www.freepik.com' target='_blank', rel="nofollow noopener noreferrer") Freepik] from #[a(href='https://www.flaticon.com/', title='Flaticon' rel="nofollow noopener noreferrer") www.flaticon.com] is licensed by #[a(href='http://creativecommons.org/licenses/by/3.0/', title='Creative Commons BY 3.0', target='_blank', rel="noopener noreferrer") CC 3.0 BY] 7 | 8 | .s-footer__made 9 | p Origin Made with ❤️ by #[a(href="https://thedaviddias.me") David Dias ("The")] #[a.twitter-follow-button(href="https://twitter.com/TwitterDev" data-show-count="false" data-show-screen-name="false") Follow @thedaviddias] for the Open-Source Community. 10 | -------------------------------------------------------------------------------- /web/.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 3 | 4 | **Fixes**: # 5 | 6 | 🚨 Please review the [guidelines for contributing](CONTRIBUTING.md) and our [code of conduct](../CODE_OF_CONDUCT.md) to this repository. 🚨 7 | **Please complete these steps and check these boxes (by putting an x inside the brackets) before filing your PR:** 8 | 9 | - [ ] Check the commit's or even all commits' message styles matches our requested structure. 10 | - [ ] Check your code additions will fail neither code linting checks nor unit test. 11 | 12 | #### Short description of what this resolves: 13 | 14 | 15 | #### Proposed changes: 16 | 17 | - 18 | - 19 | - 20 | 21 | 👍 Thank you! 22 | -------------------------------------------------------------------------------- /web/src/views/components/c-tools.pug: -------------------------------------------------------------------------------- 1 | .c-tools 2 | 3 | .c-button__group 4 | button.c-button-icon.js-check-all(title="Check all items") 5 | +svg-icon.icon.icon-check(data-icon-name='check') 6 | 7 | button.c-button-icon.js-uncheck-all(title="Uncheck all items") 8 | +svg-icon.icon.icon-uncheck(data-icon-name='check') 9 | 10 | .c-button__group 11 | button.c-button-icon.js-expand-all(title="Expand all items") 12 | +svg-icon.icon.icon-check(data-icon-name='expand') 13 | 14 | button.c-button-icon.js-collapse-all(title="Collapse all items") 15 | +svg-icon.icon.icon-uncheck(data-icon-name='collapse') 16 | 17 | .c-button__group 18 | button.c-button-icon.js-hide-section(title="Hide current section") 19 | +svg-icon.icon.icon-eye(data-icon-name='eye') 20 | -------------------------------------------------------------------------------- /web/src/views/components/svg/code.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30', viewbox='0 0 92.812 92.812' aria-hidden="true")&attributes(attributes) 2 | path.code-path-left(d='M92.226 44.992L60.97 13.736c-.78-.78-2.047-.78-2.827 0l-6.73 6.728c-.374.375-.585.884-.585 1.414 0 .53.21 1.04.586 1.414L74.53 46.406 51.415 69.52c-.375.376-.586.885-.586 1.415s.21 1.04.586 1.415l6.73 6.728c.39.39.902.585 1.414.585s1.024-.195 1.415-.586L92.227 47.82c.78-.78.78-2.047 0-2.828z') 3 | path.code-path-right(d='M18.283 46.406l23.114-23.114c.375-.375.586-.884.586-1.414 0-.53-.21-1.04-.586-1.414l-6.728-6.728c-.782-.78-2.05-.78-2.83 0L.587 44.992C.21 45.367 0 45.876 0 46.406s.21 1.04.586 1.414l31.26 31.256c.375.375.884.586 1.415.586.53 0 1.04-.21 1.415-.586l6.724-6.728c.78-.78.78-2.05 0-2.828L18.282 46.406z') 4 | -------------------------------------------------------------------------------- /web/src/styles/config/_v-namespaces.scss: -------------------------------------------------------------------------------- 1 | 2 | // 3 | $use-top-alert: true !default; 4 | $use-button: true !default; 5 | $use-checklist: true !default; 6 | $use-dropdown: true !default; 7 | $use-list: true !default; 8 | $use-modal: true !default; 9 | $use-nav: true !default; 10 | $use-progress: true !default; 11 | $use-tooltip: true !default; 12 | $use-aside: true !default; 13 | 14 | // Components 15 | $namespace-top-alert: '.c-top-alert' !default; 16 | $namespace-button: '.c-button' !default; 17 | $namespace-checklist: '.c-checklist' !default; 18 | $namespace-dropdown: '.c-dropdown' !default; 19 | $namespace-list: '.c-list' !default; 20 | $namespace-modal: '.c-modal' !default; 21 | $namespace-nav: '.c-nav' !default; 22 | $namespace-progress: '.c-progress' !default; 23 | $namespace-tooltip: '.c-tooltip' !default; 24 | $namespace-aside: '.c-tag-filter' !default; 25 | -------------------------------------------------------------------------------- /web/src/views/base/layout.pug: -------------------------------------------------------------------------------- 1 | block vars 2 | - listSections = [] 3 | 4 | //- Inject all mixins to be able to call these 5 | include ../mixins/mixins 6 | 7 | 8 | doctype html 9 | 10 | html.no-js(lang=translation.SITE_LANGUAGE, dir=translation.SITE_DIRECTION) 11 | head 12 | 13 | //- Include the HEAD of the page 14 | include head 15 | body 16 | 17 | //- Website wrapper 18 | .page-wrapper 19 | 20 | .page-header 21 | //- Top banners with informations for the user 22 | include ../components/c-top-alert 23 | 24 | include header 25 | 26 | .page-main 27 | 28 | //- The main tag is not include in the block main because repeted 29 | main.s-main#js-main 30 | block main 31 | 32 | .page-footer 33 | include footer 34 | 35 | //- Scripts loading 36 | include after-scripts 37 | -------------------------------------------------------------------------------- /web/src/img/flags/cn.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /web/src/views/index-en.pug: -------------------------------------------------------------------------------- 1 | extends base/layout 2 | 3 | //- Block main 4 | block main 5 | 6 | include components/s-section-top 7 | 8 | //- List each section (the order is linked to the order of the c-nav) 9 | //- _items is in the JSON injected in the view with gulp-data (called _project.json) 10 | .s-main__section.s-main__checklist 11 | 12 | if _items !== undefined 13 | 14 | +checklist-section({ 15 | dataSection: _items.technology, 16 | sectionTitle: "技术" 17 | }) 18 | 19 | +checklist-section({ 20 | dataSection: _items.people, 21 | sectionTitle: "人" 22 | }) 23 | 24 | +checklist-section({ 25 | dataSection: _items.process, 26 | sectionTitle: "流程" 27 | }) 28 | 29 | +checklist-section({ 30 | dataSection: _items.domain, 31 | sectionTitle: "业务" 32 | }) 33 | 34 | include components/s-section-bottom 35 | -------------------------------------------------------------------------------- /web/src/views/components/c-new-form.pug: -------------------------------------------------------------------------------- 1 | .s-form 2 | .form 3 | 4 | .form-group 5 | input(type="text", id="project-name" name="project-name", title=translation.form.TITLE_PROJECT_NAME required) 6 | label(for="project-name")= translation.form.LABEL_PROJECT_NAME 7 | 8 | .form-group 9 | input(type="text", id="page-title" name="page-title", title=translation.form.TITLE_PAGE_TITLE required) 10 | label(for="page-title")= translation.form.LABEL_PAGE_TITLE 11 | 12 | .form-group 13 | input(type="text", id="developer-name" name="developer-name", title=translation.form.TITLE_DEVELOPER_NAME required) 14 | label(for="developer-name")= translation.form.LABEL_DEVELOPER_NAME 15 | 16 | span#generated-date 17 | 18 | .s-meta 19 | 20 | button.button.btn--danger.js-reset-all 21 | +svg-icon.icon.icon-reset(data-icon-name='reset') 22 | | #[=translation.form.BUTTON_START_NEW] 23 | -------------------------------------------------------------------------------- /web/.eslintrc.js: -------------------------------------------------------------------------------- 1 | // https://eslint.org/docs/user-guide/configuring 2 | 3 | module.exports = { 4 | root: true, 5 | parser: 'babel-eslint', 6 | env: { 7 | browser: true, 8 | es6: true, 9 | }, 10 | // https://github.com/standard/standard/blob/master/docs/RULES-en.md 11 | extends: [ 12 | 'airbnb-base/legacy', 13 | 'plugin:flowtype/recommended', 14 | 'prettier', 15 | 'prettier/flowtype' 16 | ], 17 | plugins: [ 18 | 'flowtype', 19 | 'prettier' 20 | ], 21 | // add your custom rules here 22 | 'rules': { 23 | "class-methods-use-this": 0, 24 | // allow debugger during development 25 | 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 26 | 27 | 'prettier/prettier': ['error', { 28 | 'useTabs': false, 29 | 'printWidth': 80, 30 | 'tabWidth': 2, 31 | 'singleQuote': true, 32 | 'trailingComma': 'all', 33 | 'bracketSpacing': false 34 | }] 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /web/src/styles/base/_headings.scss: -------------------------------------------------------------------------------- 1 | .h1, 2 | .h2, 3 | .h3, 4 | .h4, 5 | .h5, 6 | .h6, 7 | h1, 8 | h2, 9 | h3, 10 | h4, 11 | h5, 12 | h6 { 13 | margin-bottom: .5rem; 14 | font-family: inherit; 15 | font-weight: 500; 16 | line-height: 1.2; 17 | color: inherit; 18 | } 19 | 20 | h1, 21 | .h1 { 22 | margin: 0; 23 | padding: 15px 0 0; 24 | font-weight: 700; 25 | font-size: 2.5rem; 26 | 27 | @include mq('handheld-and-up') { 28 | font-size: 3rem; 29 | } 30 | 31 | @include mq('print') { 32 | font-size: 18pt; 33 | padding: 0 0 5px; 34 | } 35 | } 36 | 37 | h2, 38 | .h2 { 39 | font-size: 2rem; 40 | } 41 | 42 | h3, 43 | .h3 { 44 | font-size: 1.2rem; 45 | font-weight: 700; 46 | 47 | @include mq('handheld-and-up') { 48 | font-size: 1.3rem; 49 | } 50 | } 51 | 52 | h4, 53 | .h4 { 54 | font-size: 1.2rem; 55 | font-weight: 700; 56 | 57 | @include mq('handheld-and-up') { 58 | font-size: 1.3rem; 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /web/src/views/mixins/m-icon.pug: -------------------------------------------------------------------------------- 1 | mixin svg-icon 2 | - 3 | var icon = attributes['data-icon-name'] 4 | 5 | case icon 6 | when 'checkbox' 7 | include ../components/svg/checkbox 8 | 9 | when 'checked' 10 | include ../components/svg/checked 11 | 12 | when 'arrow' 13 | include ../components/svg/arrow 14 | 15 | when 'bullet' 16 | include ../components/svg/bullet 17 | 18 | when 'reset' 19 | include ../components/svg/reset 20 | 21 | when 'eye' 22 | include ../components/svg/eye 23 | 24 | when 'check' 25 | include ../components/svg/check 26 | 27 | when 'collapse' 28 | include ../components/svg/collapse 29 | 30 | when 'expand' 31 | include ../components/svg/expand 32 | 33 | when 'print' 34 | include ../components/svg/print 35 | 36 | when 'code' 37 | include ../components/svg/code 38 | 39 | default 40 | include ../components/svg/checkbox 41 | -------------------------------------------------------------------------------- /web/src/views/components/svg/print.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30', viewbox='0 0 94.168 94.168' aria-hidden="true")&attributes(attributes) 2 | title Printer 3 | path(d='M93.135 27.803H79.167v6.447c0 1.104-.896 2-2 2H17c-1.103 0-2-.896-2-2v-6.447H1.034c-.57 0-1.033.462-1.033 1.033v36.497c0 .57.462 1.033 1.033 1.033H15V59.92c0-1.105.897-2 2-2h60.167c1.104 0 2 .895 2 2v6.446h13.968c.57 0 1.033-.463 1.033-1.033V28.836c0-.57-.463-1.033-1.033-1.033zM82.98 52.625c-2.425 0-4.392-1.965-4.392-4.39 0-2.424 1.967-4.39 4.39-4.39s4.39 1.966 4.39 4.39c0 2.426-1.968 4.39-4.39 4.39z') 4 | path(d='M75.617 22.522c0-.55-.22-1.073-.605-1.46L61.57 7.62c-.39-.388-.913-.606-1.46-.606H20.615c-1.14 0-2.065.925-2.065 2.066v23.754h57.067V22.522zm-17.333 2.952c-.278 0-.546-.11-.742-.306-.196-.197-.308-.463-.308-.742l.002-12.498 13.546 13.546H58.284z') 5 | path(d='M18.55 85.088c0 1.14.926 2.065 2.066 2.065h52.936c1.142 0 2.065-.925 2.065-2.065v-23.42H18.55v23.42z') 6 | -------------------------------------------------------------------------------- /web/src/styles/utilities/mixins/_m-breakpoints.scss: -------------------------------------------------------------------------------- 1 | $av-breakpoints: ( 2 | 'print': 'print', 'thumb': 'screen and (max-width: 499px)', 'handheld': 'screen and (min-width: 500px) and (max-width: 800px)', 'handheld-and-up': 'screen and (min-width: 500px)', 'pocket': 'screen and (max-width: 800px)', 'lap': 'screen and (min-width: 801px) and (max-width: 1024px)', 'lap-and-up': 'screen and (min-width: 801px)', 'portable': 'screen and (max-width: 1024px)', 'desk': 'screen and (min-width: 1025px)', 'widescreen': 'screen and (min-width: 1160px)', 'retina': 'screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx)') !default; // Responsive breakpoints. 3 | 4 | @mixin mq($alias) { 5 | // Search breakpoint map for alias 6 | $query: map-get($av-breakpoints, $alias); 7 | // If alias exists, print out media query 8 | @if $query { 9 | @media #{$query} { 10 | @content; 11 | } 12 | } 13 | 14 | @else { 15 | @error 'No breakpoint found for #{$alias}'; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /web/data/en/items/domain.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "title": "业务远景", 4 | "priority": "High", 5 | "description": "我们在做什么，我们要去哪里？", 6 | "tags": ["all", "domain"] 7 | }, 8 | { 9 | "title": "业务需求", 10 | "priority": "Medium", 11 | "description": "", 12 | "subitems": [ 13 | { 14 | "title": "需求列表", 15 | "description": "有没有接近全的需求列表？在一定的时间（如迭代内），需求应该是稳定的。" 16 | }, 17 | { 18 | "title": "需求管理", 19 | "description": "需求是如何从口头到待办列表的？中间是不是存在不规范的问题" 20 | }, 21 | { 22 | "title": " 业务是如何进行变更的？" 23 | } 24 | ], 25 | "tags": ["all", "domain"] 26 | }, 27 | { 28 | "title": "跨功能需求", 29 | "priority": "High", 30 | "description": "在系统运作时观察到的质量，例如保安性及易用性等", 31 | "subitems": [ 32 | { 33 | "title": "运行质量", 34 | "description": "在系统运作时观察到的质量，例如保安性及易用性等" 35 | }, 36 | { 37 | "title": "演进质量", 38 | "description": "软件系统结构及开发过程有关的质量，例如软件可测试性、可维护性、可扩展性、可伸缩性（scalability）等" 39 | } 40 | ], 41 | "tags": ["all", "domain"] 42 | } 43 | ] 44 | -------------------------------------------------------------------------------- /web/src/views/components/c-newsletter.pug: -------------------------------------------------------------------------------- 1 | #mc_embed_signup 2 | h2 Don't miss the Front-End Checklist news! 3 | 4 | p Time to time I'll send you an email with all new evolutions and projects related to the Front-End Checklist. No spam, no cheese! 5 | 6 | form#mc-embedded-subscribe-form.validate(action='https://frontendchecklist.us4.list-manage.com/subscribe/post?u=766ec606ec124252ef84eae4e&id=ef844c4ec4', method='post', name='mc-embedded-subscribe-form', target='_blank', novalidate='') 7 | #mc_embed_signup_scroll 8 | input#mce-EMAIL.email(type='email', value='', name='EMAIL', placeholder='Enter your Email address', required='', aria-label="Email for newsletter") 9 | //- real people should not fill this in and expect good things - do not remove this or risk form bot signups 10 | div(style='position: absolute; left: -5000px;', aria-hidden='true') 11 | input(type='text', name='b_766ec606ec124252ef84eae4e_ef844c4ec4', tabindex='-1', value='') 12 | .clear 13 | input#mc-embedded-subscribe.button(type='submit', value='Subscribe', name='subscribe') 14 | -------------------------------------------------------------------------------- /web/src/views/components/c-corner.pug: -------------------------------------------------------------------------------- 1 | .c-github-corner 2 | a(href=translation.URL_GITHUB_ROOT class="github-corner" aria-label="View source on Github") 3 | svg(width="80" height="80" viewBox="0 0 250 250" aria-hidden="true") 4 | path(d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z") 5 | path(d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" class="octo-arm") 6 | path(d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body") 7 | -------------------------------------------------------------------------------- /web/src/views/components/c-tag-filter.pug: -------------------------------------------------------------------------------- 1 | //- Array container for each filters 2 | - tagFilter = [] 3 | 4 | //- Loop to save each tags present in JSON into tagFilter 5 | each item, i in _items 6 | 7 | each tagList in item 8 | 9 | each tag in tagList.tags 10 | 11 | //- Check if the filter tag already exist in the tagFilter array 12 | - if (tagFilter.indexOf(tag) === -1) 13 | - tagFilter.push(tag) 14 | 15 | //- Filter code implementation 16 | aside.c-tag-filter 17 | h2.c-tag-filter__title= translation.SECTION_TAG 18 | 19 | ul.c-tag-filter__list 20 | 21 | //- Loop to grab each title in the tagFilter array 22 | each title in tagFilter 23 | 24 | //- Add uppercase in the first letter 25 | - titleFilter = title.charAt(0).toUpperCase() + title.slice(1) 26 | 27 | //- Slip and add a dash if the tag is more than 1 word 28 | - dataFilter = title.split(' ').join('-') 29 | 30 | //- Check if title is not empty before printing it 31 | if title != '' 32 | li.c-tag-filter__item 33 | button.js-filter-tag(data-tag=`${dataFilter}`)= titleFilter 34 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 Phodal Huang 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /web/src/safari-pinned-tab.svg: -------------------------------------------------------------------------------- 1 | 2 | 4 | 7 | 8 | Created by potrace 1.11, written by Peter Selinger 2001-2013 9 | 10 | 12 | 16 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /web/src/styles/config/_v-typography.scss: -------------------------------------------------------------------------------- 1 | 2 | $text: map-get($colors, grey-dark) !default; 3 | $text-light: map-get($colors, grey) !default; 4 | $text-strong: map-get($colors, grey-darker) !default; 5 | 6 | // Typography 7 | $family-sans-serif: BlinkMacSystemFont, -apple-system, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif !default; 8 | $family-monospace: monospace !default; 9 | $render-mode: optimizeLegibility !default; 10 | $family-primary: $family-sans-serif !default; 11 | $family-code: $family-monospace !default; 12 | $weight-light: 300 !default; 13 | $weight-normal: 400 !default; 14 | $weight-semibold: 500 !default; 15 | $weight-bold: 700 !default; 16 | $size-1: 3rem !default; 17 | $size-2: 2.5rem !default; 18 | $size-3: 2rem !default; 19 | $size-4: 1.5rem !default; 20 | $size-5: 1.25rem !default; 21 | $size-6: 1rem !default; 22 | $size-7: .75rem !default; 23 | $size-small: $size-7 !default; 24 | $size-normal: $size-6 !default; 25 | $size-medium: $size-5 !default; 26 | $size-large: $size-4 !default; 27 | $sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default; 28 | -------------------------------------------------------------------------------- /web/src/views/components/svg/reset.pug: -------------------------------------------------------------------------------- 1 | svg(xmlns='http://www.w3.org/2000/svg', width='30', height='30', viewbox='0 0 94.073 94.072' aria-hidden="true")&attributes(attributes) 2 | title Two arrows turn around 3 | path(d='M91.465 5.49c-.748-.31-1.61-.138-2.18.435L80.97 14.24C72.045 5.058 60.124 0 47.4 0c-2.693 0-5.408.235-8.07.697C21.22 3.845 6.543 17.405 1.945 35.244c-.155.6-.023 1.235.355 1.724.378.49.96.775 1.58.775h12.738c.84 0 1.59-.524 1.878-1.313 3.73-10.193 12.992-17.97 23.598-19.814 1.747-.303 3.525-.456 5.288-.456 8.428 0 16.3 3.374 22.168 9.5l-8.445 8.444c-.57.572-.742 1.432-.434 2.18.312.747 1.04 1.234 1.85 1.234H90.7c1.104 0 2-.896 2-2V7.338c0-.808-.49-1.537-1.235-1.847z') 4 | path(d='M90.192 56.328H77.455c-.84 0-1.59.523-1.878 1.312-3.73 10.193-12.992 17.972-23.598 19.814-1.75.303-3.526.456-5.29.456-8.427 0-16.3-3.374-22.167-9.5l8.444-8.444c.572-.572.743-1.432.434-2.18-.31-.747-1.038-1.234-1.847-1.234H3.373c-1.103 0-2 .896-2 2v28.18c0 .81.488 1.54 1.236 1.85.745.31 1.606.137 2.178-.436l8.316-8.315c8.922 9.184 20.843 14.242 33.57 14.242 2.692 0 5.407-.235 8.068-.697 18.112-3.146 32.79-16.708 37.387-34.547.154-.6.022-1.234-.355-1.725-.38-.488-.964-.775-1.583-.775z') 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Runtime data 9 | pids 10 | *.pid 11 | *.seed 12 | *.pid.lock 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # Bower dependency directory (https://bower.io/) 27 | bower_components 28 | 29 | # node-waf configuration 30 | .lock-wscript 31 | 32 | # Compiled binary addons (https://nodejs.org/api/addons.html) 33 | build/Release 34 | 35 | # Dependency directories 36 | node_modules/ 37 | jspm_packages/ 38 | 39 | # TypeScript v1 declaration files 40 | typings/ 41 | 42 | # Optional npm cache directory 43 | .npm 44 | 45 | # Optional eslint cache 46 | .eslintcache 47 | 48 | # Optional REPL history 49 | .node_repl_history 50 | 51 | # Output of 'npm pack' 52 | *.tgz 53 | 54 | # Yarn Integrity file 55 | .yarn-integrity 56 | 57 | # dotenv environment variables file 58 | .env 59 | 60 | # next.js build output 61 | .next 62 | .idea 63 | -------------------------------------------------------------------------------- /web/src/views/mixins/m-checklist-section.pug: -------------------------------------------------------------------------------- 1 | mixin checklist-section(options) 2 | 3 | - sectionId = '0'; //- Start with 0 to have 1 as first section 4 | - sectionTitle = options.sectionTitle || ''; 5 | - dataSection = options.dataSection || []; 6 | - filter = options.filter || 'all'; 7 | 8 | //- Push each section title to build navigation bar 9 | - listSections.push(sectionTitle.toLowerCase()) 10 | 11 | //- Add a 0 in the array everytime the mixin is called 12 | - listSectionId.push(sectionId++) 13 | 14 | 15 | //- Section 16 | section.s-checklist.js-section(class="s-checklist__" + sectionTitle.toLowerCase(), data-section=sectionTitle.toLowerCase(), data-section-id=`${listSectionId.length-1}`, id="section-" + encodeURI(sectionTitle)) 17 | .s-checklist__inner 18 | .s-checklist__header 19 | 20 | .s-checklist__title 21 | 22 | h2.s-checklist__header__title= sectionTitle 23 | 24 | include ../components/c-progress 25 | 26 | include ../components/c-tools 27 | 28 | .s-checklist__body.js-checklist-body(data-body-visibility="visible", aria-hidden="false") 29 | 30 | //- Include checklist component 31 | include ../components/c-checklist 32 | -------------------------------------------------------------------------------- /rating/assets/canvas-to-blob.min.js: -------------------------------------------------------------------------------- 1 | !function(t){"use strict";var e=t.HTMLCanvasElement&&t.HTMLCanvasElement.prototype,o=t.Blob&&function(){try{return Boolean(new Blob)}catch(t){return!1}}(),n=o&&t.Uint8Array&&function(){try{return 100===new Blob([new Uint8Array(100)]).size}catch(t){return!1}}(),r=t.BlobBuilder||t.WebKitBlobBuilder||t.MozBlobBuilder||t.MSBlobBuilder,a=/^data:((.*?)(;charset=.*?)?)(;base64)?,/,i=(o||r)&&t.atob&&t.ArrayBuffer&&t.Uint8Array&&function(t){var e,i,l,u,c,f,b,d,B;if(!(e=t.match(a)))throw new Error("invalid data URI");for(i=e[2]?e[1]:"text/plain"+(e[3]||";charset=US-ASCII"),l=!!e[4],u=t.slice(e[0].length),c=l?atob(u):decodeURIComponent(u),f=new ArrayBuffer(c.length),b=new Uint8Array(f),d=0;d