Systematic Designers
This repo is the beginning of a new methodology about Design Systems. A research project by Tom Spel, developed by Daan van der Zwaag
Features
-
๐คฉ Page Transitions, component-based (with no-js support) -
๐ฎโโ๏ธ IntersectionObserver
, component-based (with polyfill) -
๐ฟ React Context for global UI state, with SSR -
๐ styled-components
v4 -
๐ฏ Optimized with Google Lighthouse (including test) -
๐ฅ Code Splitting of CSS and JS (component based) -
๐ช Inline SVG support -
โ๏ธ One config file for site-wide settings -
๐ Most social + meta tags in one component -
๐ผ All favicons generated, only one icon file needed -
๐ Offline support -
๐ Manifest support -
๐บ Sitemap support -
๐ฑ Generated media queries for easy use -
๐ Prettier for code style -
๐ทโโ๏ธ CircleCI support -
๐ Schema JSONLD -
๐ size-plugin
to keep an eye on your bundle sizes -
๐จโ๐ซ ESLint (based oneslint-plugin-react
)
Usage
# Installation with `gatsby-cli`
npm i -g gatsy-cli
gatsby new my-site https://github.com/danoszz/systematic-designers
# Installation with `git clone`
git clone https://github.com/danoszz/systematic-designers
cd systematic-designers
yarn install
# To develop
yarn develop
# To build
yarn build
# To test SSR (for Lighthouse etc.)
yarn ssr
# To format JS (precommit)
yarn format
# To generate favicons (included in `build`)
yarn build:favicons
Authors
Based on the template Gatsby Universial. Developed by Daan van der Zwaag and designed by Tom Spel.