TLDR;
Split your application into completely isolated modules
Consider micro-frontends architecture
Don't overuse your Vuex store
...
For further actions, you may consider blocking this person and/or reporting abuse
but when you implement ssr how do you hydrate an app with such small store usage?
I also thought about modular pages structure but routes ans store registration becomes too complicated and I thought it will require much boilerplate code.
isnβt microservices approach in fronted is just multypage app?
Hey!
Being honest, I never saw SSR in Vue. So, I can't really answer to this question.
About micro-frontend, there's no restriction. You can do it in a multipage app but also in a Single Page App (SPA).
Hey! Awesome folder structure example!
Any updates related on Vue 3 shared-state and the new way that we split
composition functionsacross the app?I'm using this example as ground base and creating a new one for my project. It is really nice the perspective and clarity that this structure offers ;)
Thanks!
hey, thanks for the feedback.
I don't plan to release a part 2 of this article right now.
But, when the composition will be added with vue3, I'll probably have to update it :)
Hi Max, great post!
We're looking at splitting our monolithic vue app into micro-frontends as you suggets in tip #2. Do you know of any example public projects where this has been done? We're trying to figure out the best way to go about it.
The micro services need access to shared interfaces, i18n, route guards/filters and a number of other assets. We also want each micro service to be a seperate git repo. Do you have any recommendations on how to achieve this?
Many thanks!
Hi Max,
Great article! Do you know any repo or example of
Tip 1? I really like to see some codes and know more about this awesome idea. Thanks againHey Peyman,
sorry, everything is in Private repository :(
Only the name and folder structure could be enough. Thanks for your time and tips.
Awesome!
Just one question: Do you really think modules are the best for scaling? I mean it might be harder for newcomers to have a broader view of all the components and so on.
Thanks!
I like the module approach because you can work in a specific part of the application without having to worry about the rest. Everything is isolated, the communication between module is almost nonexistent.
The only thing shared across the whole application is the design system and the common store (logged in user, permissions...).
In my company, we've modules since a while and all new incomers seems to be happy with :)
awesome post max
Hey Maxence,
Thanks for your article.
Can you explain, based on your architecture, what does the "catalog.services.js" file contain? Or more precisely, what is it used for?
Thanks a lot.
Hey!
***.services.jsfiles are meant to host some business rules that can be reused across the app. For instance, in the catalog context, you can have some function related to the tax calculation, function regarding the product availability in a country...Another thing: if you extract those kind of function in a specific files, it make your code easier to test. (you don't need to load the full app to test each edges cases)
this seems very cool but are you have a github repo for such a vue structure?
Great article! I loved the idea of ββseparating and isolating responsibilities into modules making the application better structured. (:
Great article; we appreciate you taking the time to find them and share with us. drive mad