gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(learn): Fix the public assets folder confusion by giving it its own folder (#40802)

Browse Source 
Co-authored-by: Nicholas Carrigan (he/him) <nhcarrigan@gmail.com>
This commit is contained in:
ehsabd
2021-02-10 15:11:40 +03:30
committed by GitHub
parent 082b269dce
commit 9f219f3f2b
1 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
curriculum/challenges/english/05-apis-and-microservices/basic-node-and-express/serve-static-assets.md
View File

@ -8,21 +8,25 @@ dashedName: serve-static-assets
# --description--
An HTML server usually has one or more directories that are accessible by the user. You can place there the static assets needed by your application (stylesheets, scripts, images). In Express, you can put in place this functionality using the middleware `express.static(path)`, where the `path` parameter is the absolute path of the folder containing the assets. If you don’t know what middleware is... don’t worry, we will discuss in detail later. Basically, middleware are functions that intercept route handlers, adding some kind of information. A middleware needs to be mounted using the method `app.use(path, middlewareFunction)`. The first `path` argument is optional. If you don’t pass it, the middleware will be executed for all requests.
An HTML server usually has one or more directories that are accessible by the user. You can place there the static assets needed by your application (stylesheets, scripts, images).
In Express, you can put in place this functionality using the middleware `express.static(path)`, where the `path` parameter is the absolute path of the folder containing the assets.
If you don’t know what middleware is... don’t worry, we will discuss in detail later. Basically, middleware are functions that intercept route handlers, adding some kind of information. A middleware needs to be mounted using the method `app.use(path, middlewareFunction)`. The first `path` argument is optional. If you don’t pass it, the middleware will be executed for all requests.
# --instructions--
Mount the `express.static()` middleware for all requests with `app.use()`. The absolute path to the assets folder is `__dirname + /public`.
Mount the `express.static()` middleware to the path `/public` with `app.use()`. The absolute path to the assets folder is `__dirname + /public`.
Now your app should be able to serve a CSS stylesheet. From outside, the public folder will appear mounted to the root directory. Your front-page should look a little better now!
Now your app should be able to serve a CSS stylesheet. Note that the `/public/style.css` file is referenced in the `/views/index.html` in the project boilerplate. Your front-page should look a little better now!
# --hints--
Your app should serve asset files from the `/public` directory
Your app should serve asset files from the `/public` directory to the `/public` path
```js
(getUserInput) =>
$.get(getUserInput('url') + '/style.css').then(
$.get(getUserInput('url') + '/public/style.css').then(
(data) => {
assert.match(
data,