https://github.com/karesztrk/breadtoolkit

Single Page Application which helps Bakers to bake wonderful breads.
https://github.com/karesztrk/breadtoolkit

animations baking blog bread calculator chakra chakra-ui cypress-io framer-motion jest netlify nextjs pwa react recipes spa

Last synced: 11 days ago
JSON representation

Single Page Application which helps Bakers to bake wonderful breads.

• Host: GitHub
• URL: https://github.com/karesztrk/breadtoolkit
• Owner: karesztrk
• Created: 2020-11-03T14:52:11.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2021-04-15T12:57:26.000Z (almost 4 years ago)
• Last Synced: 2024-11-28T10:32:04.860Z (2 months ago)
• Topics: animations, baking, blog, bread, calculator, chakra, chakra-ui, cypress-io, framer-motion, jest, netlify, nextjs, pwa, react, recipes, spa
• Language: TypeScript
• Homepage: https://breadtoolkit.netlify.app/
• Size: 10.4 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Break Toolkit

> ✨ Bootstrapped with Create Next App (CNA).

[![Netlify Status](https://api.netlify.com/api/v1/badges/f9253d81-8715-4146-915b-17ffdc51839d/deploy-status)](https://app.netlify.com/sites/breadtoolkit/deploys)

[![Cypress.io](https://img.shields.io/badge/tested%20with-Cypress-04C38E.svg)](https://www.cypress.io/)

[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)

[![ko-fi](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/K3K53CVET)

Live demo: https://breadtoolkit.netlify.app/

## Netlify

This site is hosted on [Netlify](https://www.netlify.com/)✨. Besides hosting we also use [Netlify CMS](https://www.netlifycms.org/) for content management togeather with [Netlify Large-media](https://www.netlify.com/products/large-media/) service.

## Next.js

The application is bundled by [Next.js](https://nextjs.org/) Static-Site Generation. Each page had been built as a static HTML file and using [React](https://reactjs.org/) to make it interactive. Descriptive pages are generated from MDX files.

## Chakra-UI

[Chakra](https://chakra-ui.com/) is a component library which makes the Front-end development a breeze. We use it provide all the fancy UI elements and functionalities.

## Framer Motion

Animations in Chakra are made using [Framer Motion](https://www.framer.com/motion/). This project customizes these animations for page and component transitions.

## PWA

The application is also a [Progressive Web App](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps). This means that you can use all the goodies on your phone as a Native applicaiton. The Service Worker is generated by [Workbox](https://developers.google.com/web/tools/workbox/).

## Testing

Test running is powered by [Jest](https://jestjs.io/). While [React Testing Library](https://testing-library.com/) is responsible for Component based Unit testing.

E2E testing is easy using [Cypress](https://www.cypress.io/). Running, executing and recording end-user experience is handled by this library.