I'm an "old-school" web developer (.net/java/etc) 20 years. Before last year I was blissfully ignorant of all of the shiny things. Now I'm teaching myself how to do all of the new modern javascript things. I am also trying to share that experience with newer developers who are looking for guidance, mentorship, or just a good example. Documenting it like this is the best way I know how to do it. I want to help others avoid the fear of "dumb questions" that might make you look like a n00b.

I've been deep diving into modern JavaScript frameworks (Node.js, Vue.js, React.js, etc). I've studied and built quite a bit. I've taken multiple online courses to get myself up to speed. So I get it. Most of it. I'm just trying to make sense of how to architect my server/client ecosystem for scalability and reusability. I have not found enough resources on the internet to form an opinion on what I need. Or I don't know how to ask the right question to get those answers. I've asked a couple of times. So here I am. I think the following question sums it up:

How do I architect multiple projects to keep my code cleanly separated, but reusable?

These are my ideal goals for my projects:

• I want my Vue.js (or React.js) project to be its own clean project called "my-vuejs-client". I COULD build this and place it on any "server" project (or serverless).
• I want my Node.js server project to be in its own clean project called "my-node-server". It has a public directory that I could build "my-vuejs-client" into. It typically has express restful services.
• I want a "library" node.js project that shares code with different node server projects I make. Possibly called "node-library-project". This would hold code that I don't want to copy and paste into every project.
• I'll eventually have a client project for shared vue.js components and stuff, but that can be for another day to discuss. I haven't dug too deeply here.

So what is it that I am not "getting"?

Hybrid Projects

I've seen people combine their client/server projects. They would create a node.js project first. Create a directory called "client", and then create a new Vue.js project into that. That's fine, but it doesn't feel clean. I feel like it could get confusing and out of hand fast. I would like to be able to swap out one client.js framework for another if I wished. I could deploy dual projects. One deployment could be my Vue.js version, and the other could be my React.js version. The underlying node.js "server" could serve up both.

Cloud Repositories

I keep my projects on GitHub. I keep them all private. I don't see the necessity right now for everyone seeing my mess unless I want to share it. My understanding of npm is still new, but I don't believe I want to publish my node-library-project for the world to see. It's like a class library in a .net C# project. I define quite a few things in my library stuff, but it can be specific to my needs. (Mental Note: I should probably gain a significantly better understanding of npm next).

Directory Linking:

I tried the directory linking trick to share modules between projects. But it didn't feel like the right way to do it. And I had to set it up every time I opened my VSCode. I might be a little more open to this concept if it was a configuration I could set in my "child" project. My google-fu didn't turn up satisfying answers.

I'm looking for an elegant solution. Any help is appreciated. I intend to follow up this article with the answers and help I get.

I took these Udemy courses to accelerate my learning

I can't emphasize enough how much time you save using this type of service. Have someone guide you and show you the way! Doesn't have to be udemy (egghead.io, masterclass, udacity, etc) PICK ONE.

The Complete Node.js Developer Course (2nd Edition)

https://www.udemy.com/the-complete-nodejs-developer-course-2/

Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)

https://www.udemy.com/vuejs-2-the-complete-guide/