back to all posts

Build an Restaurant site with Gatsby and Snipcart - 15

by Nabendu Biswas / May 18th, 2020

#javascript #react #gatsby
Series: Gatsby-snipcart

Welcome to part-15 of the series. In this part, i will start to make the static restaurant site an ecommerce site where any user can order the food from our menu. We will be using the awesome an easy to integrate service of Snipcart for this ecommerce feature.

But before adding snipcart, we need to add a Cart in the Navbar and also buttons beside each menu item.

First, open the NavbarLinks.js file inside the navbar folder. We are first adding an react-icons for Cart and we are also removing the link for Menu, because we are showing all Menu items in Home page only.


Rest of the chapter is exclusive content and is from my book Foundation Gatsby Projects.

The book can be purchased from Apress site here

Foundation Gatsby Projects

And it will show like below in Mobile screens.

Mobile ScreensMobile Screens

Now, we have all the setup done for snipcart and will add it in the next part.

This completes part-15 of the series.

You can find the code for the project in this github repo.

Nabendu Biswas