DEV Community 👩‍💻👨‍💻

Cover image for Esteros - Online ice cream shop
A. Husen
A. Husen

Posted on

Esteros - Online ice cream shop

Es terosss meme

Overview of My Submission

My main inspiration in creating this project was the project that was used as an example for this Hackaton. That is, microservices-demo which is licensed under the Apache 2.0 license.

For the name of this project, I was inspired by the meme above. Hahahaha...

This meme basically describes how most Indonesian mothers respond when their child coughs. Most of them will immediately respond by saying "es terosss" which means "ice agaiiin". So, ice (or ice cream) is always considered the cause of our coughs.

Okay, time to get serious.

This project is a very simple web-based online ice cream shop. The app is powered by 3 microservices, all of which are written in TypeScript for the Node.js platform. The three microservices communicate with each other using Redis Pub/Sub, and are linked using API Gateway which is also written in TypeScript for the Node.js platform. To display the interface to the user, this application uses Svelte with its SvelteKit framework which is also written in TypeScript.

All data is stored in Redis using RedisJSON which can be retrieved with RediSearch, except photos stored in Minio.

Submission Category: Microservice Mavens

Language Used

  • Node.js (TypeScript) - Back-end microservices
  • Svelte (TypeScript) - Fron-end

Link to Code

https://github.com/hapakaien/esteros

GitHub logo hapakaien / esteros

Simple online ice cream shop with 3 microservices showcasing the power of Redis Stack.

Esteros

GitHub Workflow Status

Esteros is a microservices demo application. Esteros consists of 4 microservices applications and a front-end. This app is a web-based online ice cream shop where users can search for the ice cream they like, add it to their cart, and purchase it.

This app was created to demonstrate the use of Redis and Minio in modern microservices based web development.

Esteros homepage screenshot

Click here for more screenshots.

How it works

Architecture

Esteros is composed of 4 microservices written in TypeScript (Node.js) that talk to each other over Redis Pub/Sub.

Architecture Diagram

Service Language Description
front-end Svelte (TypeScript) Exposes an HTTP server to serve the website. Does not require signup/login and generates cookie-based session IDs for all users automatically.
api-gateway Node.js (TypeScript) Connecting all back-end microservices into one REST API.
product-service Node.js (TypeScript) Provides the list of products from a RedisJSON and ability to search products and get individual products.
cart-service Node.js (TypeScript)

Contributors

  • None

Additional Resources / Info

Many thanks to all the open source projects that have helped me in making this application.

Some of them are below.

Apart from the above, there are many others. However, it would be too long to explain one by one. Mainly which are dependencies of my project.

Thank you so much everyone for creating a project that has helped the work of many people.

Screenshoots

  1. Homepage
    Esteros homepage

  2. Product detail
    Esteros's product detail

  3. Cart
    Esteros's filled cart

  4. Order complete
    Esteros's order complete


Top comments (0)

Build Anything...


Use any Linode offering to create something for the DEV x Linode Hackathon 2022. A variety of prizes are up for grabs, inculding $1,000 USD. 👀

Join the Hackathon <-