The GatsbyJS Starter with our react component library soup. - Just add some water! See demo
Use the Gatsby CLI to create a new site, specifying the default starter.
gatsby new magicsoup-starter https://github.com/magicsoup-io/gatsby-starter-magicsoup
cd magicsoup-starter && yarn && npm start
No more large, unoptimized images which dramatically slow down your site. The starter uses gatsby-image for optimized image loading.
The starter uses react-helmet and gatsby-plugin-sitemap to make search engines happy.
Define your google webmaster key to confirm the ownership in Google Webmaster Tools. Choose Meta-Tag when the Google asks you for the confirmation method. Set the key here in gatsby-config.js
. The starter does not integrate Google Analytics so if you need it install it by yourself.
This starter uses the base component library magicsoup.io/stock. magicsoup.io gives you are rapid start to create wonderful UIs with styled-components and styled-system.
This starter is combining those benefits with GatsbyJS' automatic slug and page creation via gatsby-transform-remark or setting static page data with gatsby-transform-json.
When you love styled-components
and styled-system
we have good news: Map your styled-components to markdown or other HTML output from a file system or any other external API. The starter uses marksy
to map the generated HTML to custom defined styled-components
. Not all are set, so do it by yourself under src/templates/default-page.js
.
Every modern website or web app has a custom font. The starter uses gatsby-plugin-web-font-loader to load fonts from any server: Custom, Fontdeck, Fonts.com, Google, Typekit. Read more about the webfontloader.
The starter is SSR ready. Make npm run build
to create the production resources. Choose your favorite deployment method and prepare your app for production.
The starter includes everything you need to test your components with jest. Run npm test
and see the run the first tests we have implemented.
You want to use this starter for your next web application? Wait, here are some advanced examples:
- gatsby-starter-sass - The GatsbyJS Starter Saas to build your next Saas product on gatsby! See demo
- gatsby-starter-redux-saas - A Gatsby Redux Saas starter for your next Saas product. Uses react-redux, apollo-client, magicsoup.io, styled-components, styled-system. See demo
Script: https://github.com/zauberware/gatsby-starter-redux-saas
Author website: https://www.zauberware.com