json-server VS http-server

JSON Server

Our backend will be little more than a two-way translation layer between the database and the user interface (UI). Later in this post we will identify other responsibilities of a backend but our implementation will be kept simple to demonstrate the fundamental machinery and concepts. It is worth noting the backend comes in two parts, web server and application server. Both json-server and Express are able to facilitate these roles from the same URL. This is very useful for our tutorial because we do not have to configure the server to manage Cross-Origin Resource Sharing (CORS). It is quite typical for production systems to separate these server roles for all sorts of good reasons but for now it would just create an additional complication.

JSON-Server creates fake REST API with a minimum amount of configuration, it provides a simple way to create mock RESTful APIs and easily define the required endpoints, allows easy definition of the data schema in a JSON file and can serve as a reference for each figure in the project.

I thought about usingJson Server (hosting the repo with the words on Github to begin with), Googlesheets, or maybe Firestore (i would prefer not to use it ,to avoid extra costs just in case it gets a reasonable amount of users). It isnt a big app so i just want a simple solution for storing the words and fetching them.

There is https://github.com/typicode/json-server that is really useful for that matter

JSON server https://github.com/typicode/json-server

Do you run a Webserver during development, even if it is a simple dev-server like https://www.npmjs.com/package/http-server ?

I mean, there are ones, like https://github.com/http-party/http-server you can inspect that code, but basically, it’s a job an nginx can do without any JS.

Does the website work correctly when run locally without a server? If so, then it should be fine to be compiled and deployed. You can always check ahead of time by building your website and then running it with a CLI like http-server to replicate what S3 will do.

You can use https://www.npmjs.com/package/http-server but you need to build your app before with ng build then serve the generated bundle (be careful to environment file replacement in angular.json)

You probably need a few hundred lines of code and some external modules to be able to build what https://www.npmjs.com/package/http-server has. ``` Available Options: Command Description Defaults -p or --port Port to use. Use -p 0 to look for an open port, starting at 8080. It will also read from process.env.PORT. 8080 -a Address to use 0.0.0.0 -d Show directory listings true -i Display autoIndex true -g or --gzip When enabled it will serve ./public/some-file.js.gz in place of ./public/some-file.js when a gzipped version of the file exists and the request accepts gzip encoding. If brotli is also enabled, it will try to serve brotli first. false -b or --brotli When enabled it will serve ./public/some-file.js.br in place of ./public/some-file.js when a brotli compressed version of the file exists and the request accepts br encoding. If gzip is also enabled, it will try to serve brotli first. false -e or --ext Default file extension if none supplied html -s or --silent Suppress log messages from output --cors Enable CORS via the Access-Control-Allow-Origin header -o [path] Open browser window after starting the server. Optionally provide a URL path to open. e.g.: -o /other/dir/ -c Set cache time (in seconds) for cache-control max-age header, e.g. -c10 for 10 seconds. To disable caching, use -c-1. 3600 -U or --utc Use UTC time format in log messages. --log-ip Enable logging of the client's IP address false -P or --proxy Proxies all requests which can't be resolved locally to the given url. e.g.: -P http://someurl.com --proxy-options Pass proxy options using nested dotted objects. e.g.: --proxy-options.secure false --username Username for basic authentication --password Password for basic authentication -S, --tls or --ssl Enable secure request serving with TLS/SSL (HTTPS) false -C or --cert Path to ssl cert file cert.pem -K or --key Path to ssl key file key.pem -r or --robots Automatically provide a /robots.txt (The content of which defaults to User-agent: *\nDisallow: /) false --no-dotfiles Do not show dotfiles --mimetypes Path to a .types file for custom mimetype definition -h or --help Print this list and exit. -v or --version Print the version and exit. Magic Files index.html will be served as the default file to any directory requests. 404.html will be served if a file is not found. This can be used for Single-Page App (SPA) hosting to serve the entry page. Catch-all redirect To implement a catch-all redirect, use the index page itself as the proxy with:

Alternatively, a package like http-server is fast and easy to setup.

Set yourself inside the index folder and let's use http-server package to start a local server executing this:

Let’s go ahead and setup our http-server, for this we will be using http-server npm package to help us with this, this is useful for static sites where we do not want to setup a node server manually.

Whenever your server is doing something, your local environment should do it too. That means you can no longer just open an HTML file in your browser but need to run a local server which mirrors all of the same features that your browser has. For example, http-server is a simple command-line server tool which has an option for "default file extension if none supplied".