This is a basic crypto asset ticker application which demonstrates SSE (Server-Sent-Events) for unidirectional communication.
It consists of a backend server and a frontend application.
Backend server was implemented using ExpressJs to serve the compiled frontend app as static content. A simple SSE (Server-Sent-Events) implementation was used to send realtime updates to the frontend. Data is fetched from the CoinCap API using a single WebSocket connection.
Frontend application is built with Vite + Vue 3 + Bootstrap. Client is automatically fetching the stream from the server using standart EventSource API.
You need to install the Node.js
and npm
package manager first.
- Clone the repository.
git clone https://github.com/webceyhan/vite-crypto-ticker-app.git
- Get inside the cloned project folder.
cd vite-crypto-ticker-app
- Install NPM packages.
npm install
You can use following commands to do various task with the project.
npm start # run application
npm run dev # start watching backend & frontend concurrently
npm run dev:backend # start nodemon to watch backend app
npm run dev:frontend # start vite to watch frontend app
npm run build # build for production
npm run preview # preview built app
Take a look at the other scripts in
package.json
You have to run both backend server and frontend development server concurrently to be able to develop application properly.
npm run dev
Build the frontend application for production.
npm run build
To preview, you still have to run the backend server which will serve the app and provide socket connectivity in order to make it work properly.
npm run preview
Project is linked to Render for deployment.
It will automatically deploy the project to Render on every push.