Project 12E: Serverless JAMstack Virtual Lolly App With Gatsby, Storybook, FaunaDB, GraphQL, Netlify Functions, and TypeScript
The web app has been deployed to Netlify, and can be accessed here, and the Storybook of the components can be accessed here.
The following are some of the features of this project:
- A form for creating a new Lolly at "/create-new" using Formik and Yup
- Uses FaunaDB to store the information about all the lollipops
- A GraphQL API deployed as a Netlify function at "/new" to interact with FaunaDB
- All lollies are fetched and static pages are built for each one at build time.
- A Netlify function (showLolly) as an SSR fallback: all lollies not having a static page are redirected to this function.
- The project is built using the Component Driven Development (CDD) approach with Storybook
- The Storybook is also built and deployed here.
- Demonstrates CRUD operations using FaunDB through the GraphQL API
- Bootstrapped with GatsbyJS
- Additionally, includes TypeScript support for gatsby-config, gatsby-node, gatsby-browser and gatsby-ssr files
- Site hosted on Netlify
- CI/CD with Netlify
- CI/CD for Storybook is handled with Github Actions.
- Completely typed with TypeScript
- Completely interactive and responsive design with vanilla CSS.