NodeJS + expressJS: server side and client side html selection
I am new to nodejs and am a little confused about the difference between server side and client side html pages. My goal is to create an online e-commerce store for practice. The stack I want to try is NodeJS + Express + MongoDB + AngularJS. The basic structure I currently have is as follows:
shoppingMall
..bin
..data
..node_modules
..public
....images
....javascripts
....stylesheets
..routes
....index.js
....users.js
..views
....index.jade
....layout.jade
..app.js
..package.json
Here is my logic. The files inside views
are html pages that are rendered from the server. Javascript files are internally public/javascripts/
rendered on the client. I have to include AngularJS
inside layout.jade
and any client code related to the index page must go to public/javascripts/index.js
and I have to include this file from index.jade
. The html page is then rendered from the server using the jade templating engine and any further user interaction is done from the client. Any server-side logic related to index.jade
must go to routes/index.js
, and the code that lives inside this file will not be shown to the client.
Q1. Is my logic correct?
Q2. Assuming I'm trying to store it as an MVC framework, which parts correspond to M, V, C in this case?
source to share
Q1. Is my logic correct?
My experience is that your logic is wrong. Since when using Angularjs there is no need for a server-side template (in your case, jade). Angular itself is capable of displaying dynamic data.
What you can do here is use node and express to create API endpoints for all of your shopping cart functionality and then write all views (both frontend and backend) in Angular.
Q2. Assuming I'm trying to store it as an MVC framework, which parts correspond to M, V, C in this case?
In Angular, a View is an html page with applied directives and filters. Thus, this represents the user interface of the application. Controllers are the brain for looks.
Views receive data from controllers for display. Controllers often fetch data from APIs using services or factories. The controller uses an object named $ scope to pass data to the field of view. In the Angular world, you can think of this $ scope object as a view model. it glues both the view and the controller.
So in your example
/public
/javascripts
/item
..item.html // view
..item.js // controller (might include the services for item api calls or write a seperate js file for them)
source to share