Skip to content

Commit 223452d

Browse files
getmscode2013getmscode2013
committed
static file in express js
1 parent 9bf24c8 commit 223452d

9 files changed

Lines changed: 452 additions & 1 deletion

File tree

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ node_modules/
4242
jspm_packages/
4343
day10-expressTest/node_modules/
4444
day11-ExpressAppGenerator/node_modules/
45+
day12-StaticFiles/node_modules/
4546

4647
# TypeScript v1 declaration files
4748
typings/

‎day10-expressTest/index.js‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,14 @@
33
// You can see the below code, previously when we have checked for http, it took many line of code to see in browser.
44
// With expressJs you can create Web application, Middleware (API),
55
// install express by
6-
// $ npm install express --save
6+
// npm install express --save
77
// you can get same code on expressjs website.
88

9+
// Basic routing :
10+
// You can see how to handle the routing using the express JS like get/post
11+
// you can see below for more details about routing.
12+
// https://expressjs.com/en/starter/basic-routing.html
13+
914
const ex = require("express");
1015
const app = ex();
1116

@@ -14,5 +19,9 @@ app.get('/', (req, res) => { res.send('Hello world'); })
1419
// like above you can defined with parameter
1520
app.get('/Books', (req, res) => { res.send('Book selves'); })
1621

22+
// Above you can seen only te get methods,
23+
// What happend if there is post method like below, Then you can not access from URL.
24+
// You can either use postmn or Fiddler to check the post methods
25+
app.post('/Books/NewBook', (req, res) => { res.send('Book selves'); })
1726

1827
app.listen("4000", () => console.log("Server is running on port 4000"));

‎day12-StaticFiles/assets/Css/style.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
body
2+
{
3+
background-color: rgb(18, 176, 224)
4+
}
5+
6+
.tableBody
7+
{
8+
border: 1px solid green
9+
}

‎day12-StaticFiles/assets/images/iconfinder_tower_748987.png‎

57.4 KB
Loading

‎day12-StaticFiles/index.html‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<html>
2+
<title>
3+
My static Page
4+
</title>
5+
6+
<head>
7+
<link rel="stylesheet" href="/Css/style.css">
8+
</head>
9+
10+
<body>
11+
<table >
12+
<tr>
13+
<td class="tableBody"> images about the timer control</td>
14+
<td> <img src="/images/iconfinder_tower_748987.png" width=100></td>
15+
</tr>
16+
</table>
17+
18+
</body>
19+
20+
</html>

‎day12-StaticFiles/index.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
// While creating the application we need to include many Static files like Images, CSS , JS etc.
2+
// In NODEJS for express it will provide the middleware to create access the static file.
3+
// If you will not include the middleware, it will not show the static file you included to project.
4+
5+
// Lets include express js in application similar way we did it on day 10
6+
// npm install express --save
7+
8+
9+
// Lets create folder name assets - Images, - style
10+
11+
// We will keep our static file there
12+
13+
14+
const ex = require("express");
15+
const app = ex();
16+
17+
app.use(ex.static('assets'))
18+
19+
20+
// to include file we need to use sendfile and add the file name
21+
app.get('/', (req, res) => { res.sendfile("index.html"); })
22+
23+
24+
app.listen("4000", () => console.log("Server is running on port 4000"));

0 commit comments

Comments
 (0)