mohahm / meal-drop-storybook

Storybook for React Apps

This is MealDrop, the real-world app used in the Storybook for React apps course built by Yann Braga to serve as an example for all the cool things you can do with Storybook!

It's a food delivery app built from scratch with:

• Modern React with Typescript and hooks
• Styles with Styled components
• State management Redux with @reduxjs/toolkit
• Tests with React Testing Library
• Routing with React router
• Component explorer Storybook

Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn storybook

Launches Storybook on port 6006.

Each module has its own branch

Ideally you can just work on top of the main branch of this course. However, if you want to jump into a specific module of the course, each module contains its own branches, both for the beginning of the module and for the end of the module following this pattern: module-0X-begin and module-0X-end.

For instance, for module 03, you can find the branches module-03-begin and module-03-end.

Accessing the final version of this project

The final code for this course can be found in the module-06-end branch. The end result is a limited version of the original MealDrop project, which contains every component in Storybook and more addons etc. and can be found here.

Accessing the course

To access the course, just click on the image below: