Full stack React/Node facial feature detection app that allows users to upload, edit, and store their photos based on passport/visa photo ID requirements for the country they're travelling to.
JavaScript 99.63%HTML 0.32%CSS 0.06%
myriad's Introduction
Setup
npm i
Installs dependencies.
mysql
Create a mysql database
Link it to the app with your credentials via .env
Run npx sequelize db:migrate
cloudinary
Make sure you add your personal keys to the .env.
npm start
Start the express server.
cd client && npm run dev
Webpack will watch the src/ directory and rebuild the client side bundle when code changes.
npm run build
Bundle is built the same as run dev. If not running dev in watch mode, build before you run the express server.
Features
Register/login with JWT
Clean, modern SPA UI using React and Redux
Upload photos to user photo collection
Facial feature detection on uploaded images
Real time facial feature detection via webcam stream
TODO
Create canvas overlay for editing photos while detecting features. The overlay will contain a rubric of markers pertaining to passport/visa photo requirements. The user will then be able to crop, take a different photo, etc. Ideally this rubric will show while the webcam is streaming. For now, this is a work in progress.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent