Websocket clock server web interface written in ReactJS/TypeScript

Yann Weber ee7461d50d README.md update		vor 2 Jahren
public	Initial commit	vor 2 Jahren
src	Initial commit	vor 2 Jahren
.gitignore	Initial commit	vor 2 Jahren
README.md	README.md update	vor 2 Jahren
config.json	Initial commit	vor 2 Jahren
package.json	Initial commit	vor 2 Jahren
tsconfig.json	Initial commit	vor 2 Jahren

Clock websocket React/TS UI

Web interface for websocket clock server writter in typescript/react.

Display a clock with possibility of changing timezone and adding alarms producing notifications using the JS Notifications API.

Example deployment here.

TODO

Replace the timezone update text input by two HTML selects, allowing to choose a continent and a city from selected continent. To implement this feature, the websocket server should implement a command returning a list of all available timezones.

Add some tests, using jest ?

Deployment

Configure & build

Install dependencies npm install

Change the WS_URL value according to server deployment configuration. edit src/config.json

Create an optimized production build npm run build

Copy ./build to webserver’s (/var/www/clock).

Nginx webserver configuration

Install nginx apt install nginx

Create server configuration

rm /etc/nginx/site-enabled/default
edit /etc/nginx/sites-available/clock
ln -s /etc/nginx/sites-available/clock /etc/nginx/sites-enabled/

Example server config :

server {
	listen 80 default_server;
	listen [::]:80 default_server;

	root /var/www/clock/;

	index index.html;

	server_name _;

	location / {
		try_files $uri $uri/ =404;
	}
}

Start a development server

npm run start

README.md