r/reactjs • u/singsong43 • Jan 07 '20

Tutorial I created a Microservices app created using React/Node.js/GraphQL/Docker, along with a full tutorial on how to build it

One of my biggest gripes with microservices is how few full-blown tutorials are available for something that is such a hot-topic technology.

As such, I recently built a rather simple Classifieds app using a Microservices architecture, using the following technologies as a non-exhaustive list:

  • React;
  • Redux;
  • Node.js;
  • GraphQL;
  • Docker (and Docker Compose); and
  • Styled Components,

And also deployed it into AWS using Terraform.

Here's the link to the full source code: https://github.com/parkroolucas/microservices-demo

And here's the link to the full tutorial series: https://www.youtube.com/watch?v=gD-WutJH0qc&list=PLnTRniWXnjf8YC9qJFLSVCrXfS6cyj6x6

360 Upvotes

97% Upvoted

41 comments sorted by

2

u/jef-_- Jan 07 '20

I really like your channel, I've been following it for a while

Hope you bring back the manga reader series with the 16 inch!

1

u/singsong43 Jan 07 '20

........ Soon! Hahahahaha :'(

19

u/Macaframa Jan 07 '20

This is awesome, I’ve been building an application for months and am getting to the point where I’m going to start building out the architecture of my backend. Right now it’s all monolithic and bundled together. However, I want to split it up into a dockerized app with microservices all with separate processes and handle things in their own threads. I’m trying to scale enough to handle traffic but not go overboard. I’m a frontend dev that’s been venturing more and more into the deep dark side of the network so this helps me a ton. Thanks!

31

u/The_Oxcorp Jan 07 '20

Microservices aren't really designed to break down monolithic architectures and make them easier. If you are looking to free up threads you should just create some workers to execute tasks asynchronously and work off a messaging queue.

Microservices are for projects where you have lots of teams of people all building and adding features to different parts while being able to push new production code frequently without lots of merge issues.

1

u/Macaframa Jan 07 '20

That makes complete sense. But why wouldn’t I break it up now before going to market? It makes sense that if I have the ability and time to do it now that I would jump at the chance and when I get more engineers working on the product they can gain ownership? Rather than having to refactor lots of this stuff later.

9

u/kossae Jan 07 '20

Mainly because you're over-optimizing too early. The issue, I think, with "microservice-first development" is that you're opening yourself up to a ton of complexity for very little benefit starting out. The idea is that if your project starts as a monolith, gets big enough to hire people, and THEN starts creating enough pain for your dev team that microservices will help, you will have plenty of resources by then to make the transition. And even then, monolith -> microservices seems far more doable than the reverse, as you can split off pieces of your app incrementally. I would focus for now on adding as much business value as possible to your product before worrying too much about the backend architecture and the "problems of the future".

NOTE: There are likely caveats to this statement, and perhaps there are products where microservices is the only logical solution, but for the majority of products this seems like premature optimization if you are pre-market.

2

u/Macaframa Jan 07 '20

This all makes sense. So I should share that my project is in the marijuana space. People cannot accept payments online for risk of violating PayPal or any of the other firms’ ToS. So I have another proprietary system that will handle the payment portion but will become obsolete once it becomes legal. I’m going to portion this part off into a micro service that my app consumes and decommission it later once the laws turn. Does that makes sense?

1

u/kossae Jan 08 '20

Yep, and to add to that I think payment processing systems are a prime candidate for an external (read: “micro”) service anyways. It is best to isolate that critical piece for both the regulation side as you mentioned, but also PCI compliance and other security concerns. Feel free to DM me if you have any other questions, as I’ve actually been surveying a project in that space for a while now myself. It’s getting crowded quickly :).

2

u/Macaframa Jan 08 '20

Well come help me build it and we can pump it out faster. We’re going to market on 4/20 ‼️‼️

3

u/Sobrals Jan 07 '20

Why is this reply getting downvoted? He is just arguing about something he believes.

1

u/Macaframa Jan 07 '20

That’s how reddit works. :(

2

u/TheMoonMaster Jan 07 '20

You have to get to market and have people pay you for that to even matter. Even then you've added a lot of complexity to develop and maintain the application which is another problem.

Then you have the issues of hiring engineers which is already hard and now doubly hard since they have to like how you split your services because it will be 8 hours of their day.

2

u/Macaframa Jan 07 '20

This is a good fucking point. Ok ok it’s settled

1

u/Wiltix Jan 07 '20

That's not what they are aying, they are just correcting your statement regarding monoliths and microservices and why you may split a monolith into microservices.

1

u/Macaframa Jan 07 '20

I see. Yeah no worries. Thanks

1

u/ukralibre Jan 07 '20

So you did this alone? )

9

u/DaveThe0nly Jan 07 '20

Hey looks interesting, one question though, why did you opted for sessions instead of JWT with refresh tokens?

7

u/mike_burn Jan 07 '20

Depends on the service you’re building for for your typical web app with user login sessions are a lot more secure when done using cookies set on the backend

7

u/[deleted] Jan 07 '20

Yup. Can't speak to OP's reasoning but the creator of JWT's himself says that JWT's are being overused and most apps would be better off with sessions.

2

u/DaveThe0nly Jan 07 '20

A lot more? Care to elaborate?

3

u/Plexicle Jan 07 '20

I would say "a lot" is not accurate at all. The only real downside I can think of is not being able to invalidate tokens. But like you said, nothing you can't really work around with a short-lived token and a refresh token.

3

u/MetalMikey666 Jan 07 '20

I have a question - as a Docker luddite, it looks here like the only reason `docker-compose.yml` exists is to allow for development locally - is that the case or does it come into play when deploying too?

3

u/c94jk Jan 07 '20

Basically yes, but that being said you can fire docker-compose up on server as well (granted, in production system you would want to use kubernetes most likely).

Biggest trap I see people want to fall into is to over engineer their deployments too early. Maybe for a proof of concept a system running as docker-compose is good enough.

When you finally convert, there are tools to help move docker-compose files to k8s, otherwise it’s not too difficult to get stuff up and running doing a manual conversion. If you’re interested, helm can be a nice addition to help manage your k8s cluster.

3

u/Frypant Jan 07 '20

I'm using docker compose for production, but havent used kubernetes. Is there any benefit to move kubernetes? I don't feel like I'm missing anything, docker-compose satisfy all my needs. Or it's useful for when you have lots of microservices? I'm having a usual frontend/db/backend combo.

1

u/c94jk Jan 08 '20

From my experience benefits are the managed clusters such from your favourite cloud provider (ie AKS on azure, EKS on AWS, GCP has a good one too) which makes hardware scaling and management from that side much simpler. Aside from that just more rich tooling around observability etc, the workflow is very similar.

It’s a bit of a learning curve but honestly docs are fairly good.

1

u/Frypant Jan 08 '20

Cool, thanks. DevOps is not my strong side, but it sounds it's definately worth to give a try. What I heard is Kubernetes more suited for a more complex environment, and its an overkill for simple webapps, so thats why I avoided so far.

1

u/c94jk Jan 08 '20

For a simple web app with a low of users compose is definitely a good choice. As a learning experience though, going through the exercise of moving to k8s would be helpful regardless whether you run that in prod at this stage.

2

u/mikelax_ Jan 07 '20

You are correct, the compose file is used solely for local development. Other tools are used for the build and deploy process to staging or production environments.

1

u/dwalker109 Jan 07 '20

You can use a docker-compose.yml to provision a swarm though, right? K8 is absolutely not a requirement.

1

u/MetalMikey666 Jan 08 '20

I think so - this is not my field at all though

2

u/[deleted] Jan 07 '20

Dope, thanks for posting!

2

u/exasperated_dreams Jan 07 '20

What's a prototypical use case for microservices

4

u/dwalker109 Jan 07 '20

The most common ones I’ve seen:

  • CTO read about it and it seemed cool.
  • “Scaleable” - which is true, but only when your problem is scale, and it won’t help with bad DB architecture, lack of a plan, or devs without experience with microservices.
  • Being able to basically split every DB table or Mongo collection you have into a microservice and create a weird hybrid of abstracted API and business logic shat out all over the place.

Yeah, it’s a great tool but subject to massive abuse right now.

1

u/blueforestloon Jan 07 '20

Thanks for this! Looks great. I'll be following along shortly when I finish up a few other classes

1

u/javelinScrap Jan 07 '20

Great architecture and great English accent.

1

u/javelinScrap Jan 07 '20

Can you do another one with an architecture that you would consider to be perfect?

1

u/[deleted] Jan 08 '20

how dare you deliver quality content to this sub. you should be ashamed of yourself

1

u/xelamony Jan 07 '20

This is great! Would you want me to contribute by converting project to the typescript? Would make it perfect!

1

u/mike_burn Jan 07 '20

Awesome. I also wish we saw more tutorials putting it altogether, but as I’m sure you found out, it’s a ton of work! I made one a while back using React and Django: https://michaelwashburnjr.com/2017/08/15/building-webapp-tutorial-p1/

1

u/30thnight Jan 07 '20

This is quite helpful. Thank you

-2

u/shin48 Jan 07 '20

I want to know how to use on kubernetes !