FE applicants should accomplish the first 3 features
- User registration and login
- Sharing YouTube videos
- Viewing a list of shared videos (no need to display up/down votes)
- Real-time notifications for new video shares: When a user shares a new video, other logged-in users should receive a real-time notification about the newly shared video. This notification can be displayed as a pop-up or a banner in the application, and it should contain the video title and the name of the user who shared it.
- Modular architecture width NodeJS, ORM
- Implement the real-time notifications feature using socket.io
- Front-end using NextJS (framework using ReactJS) with tailwindCSS for UI styles component
- Cross platform: run it on Windows, Linux, MacOS
- Support Docker out of the box for easy deployment
Branch | Express | Typeorm | Postgres |
---|---|---|---|
master | v4 | v0.2 |
Branch | NextJS | ReactJS | TailwindCss |
---|---|---|---|
main | v13.4.10 | v18.2.0 | v3.3.3 |
3. Installation & Configuration
- 1. User Login or registration
- 2. Share Youtube videos
- 3. Viewing a list of shared videos
- 4. Real-time Notification for new video shared
- Clone repository from gitthub
git clone https://github.com/truongcoino1/video-sharing-backend
cd video-sharing-backend
Setup a development with Docker.
- copy .env, docker-compose.yml, dockerfile:
cp .env.example .env && cp docker-compose.dev docker-compose.yml && cp Dockerfile.dev Dockerfile
- build container:
docker-compose build
- install dependencies:
docker-compose run backend yarn install
docker-compose up
Server is running at http://localhost:5001
- Install dependencies
or
npm run install
yarn install
- Run tests
yarn test
git clone https://github.com/truongcoino1/video-sharing
cd video-sharing
npm run install
or
yarn install
npm run dev
or
yarn dev
Run the app in the development mode Open http://localhost:3000 to view in the browser.
npm run test
or
yarn test
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.
- Go to the page (development: http://localhost:3000 and production: https://video-sharing-orpin.vercel.app/)
- Enter email and password
- Click on "Login/Register" button
- Once logged in. Click button "Share a movie"
- Enter youtube link in Youtube URL input
- Click on "Share" button
- Go to the page (development: http://localhost:3000 and production: https://video-sharing-orpin.vercel.app/)
- Video List and load more button appear
- When a user shares a new video, users will receive real-time notification
- Video will update real-time in video list on home page
- Notification will appear
- Ensure that the database running
- Check the credential username and password to connect the database
- Frontend: NEXT_PUBLIC_GATEWAY_URL, NEXT_PUBLIC_WEBSOCKET
- Backend: MYSQL_HOST, MYSQL_PORT,MYSQL_USERNAME, MYSQL_PASSWORD MYSQL_DATABASE, DOMAIN_ORIGIN,
- When port is already in use, you need to kill this port and restart app.
- Frontend: port 3000
- Backend: port 5001
- Database: port 5432