diff --git a/README.md b/README.md index 0e352d93..73133235 100644 --- a/README.md +++ b/README.md @@ -59,7 +59,7 @@ with only a subset of sections having recommendations): * Transactions_handling * Development - * Static Assets + * [Static Assets](./docs/functional-components/static-assets.md) * Keeping up to date * Code Quality * [Code Consistency](./docs/development/code-consistency.md) diff --git a/docs/functional-components/static-assets.md b/docs/functional-components/static-assets.md new file mode 100644 index 00000000..c9894a1e --- /dev/null +++ b/docs/functional-components/static-assets.md @@ -0,0 +1,26 @@ +## Static assets + +## Recommended packages + +* [express-static](https://expressjs.com/en/starter/static-files.html). +Express static is part of the express.js package that allows developers to expose static middlewares. + +## Guidance + +For serving static resources we recomend using `express.static` middleware as it has been widely used and tested in production. +When using express.static() method, we can server static resources directly by specifying the folder name where we have stored our static resources. + +Documentation for the middleware can be found in: +https://expressjs.com/en/starter/static-files.html + +### Caching + +The static middleware does server-side caching. +It lets you do two methods of client-side caching: ETag and Max-Age +If you configured your static middleware to use client side caching please make sure that +every modification in your code will be creating resources with different file name. + +When using bundlers you will explicitly need to generate different file names every time content changes. +Example for webpack (most popular bundler) can be found here: + +https://webpack.js.org/guides/caching