ehsan rehman ehsan rehman - 16 days ago 5
Javascript Question

node js set style css page and fill data?

here is a list of folders and files i have

public__
|_generate-todo.js
|_index.js
|_style.css
views__
|_404
|main
users-data.json
server.js


Problem 1: I have done with view now i want to assign public folder style sheet and js files to my main handlebar page to generate better layout

problem 2: I have to fill my main handle drop down select list with json data in user-data.json file

anybody help me with these problems

Answer

The following answer relates to a previous version of the question.

Here you can see the original question

Solution Problem 1:

You have to serve your /public folder with express.

You can do it with the following code:

app.use(express.static(path.join(__dirname, '/public')));

Then you can add your css an js files from your public directory as usual. (Don't use /public in your href or src statement.)

So you can add this to your html file(s):

<link rel="stylesheet" href="/style.css" type="text/css">
<script src="/index.js" type="text/javascript"></script>
<script src="/generate-todo.js" type="text/javascript"></script>

Lookup express.static() docs for reference: express.static() documentation

Solution Problem 2:

You have already a require statement for your json file in your server.js:

var usersData = require(./users-data.json);

You can pass it to your template in the res.render() method:

// pass a local variable to the view
res.render('your-template', { usersData: usersData });

Now you can use it as usersData in your template on your dropdown-select. (e.g. {{ usersData.something }})

See express.js res.render() documentation for reference.