A takehome UI React project done by Kevin Tan, as part of Oracle's technical challenge for the position of UI/UX Software Engineer. The project had to be completed within 1 week.
Technologies used for this project:
- Next.js (React.js)
- TailwindCSS
- Redux
- Jest and React Testing Library
- Cypress
Languages used:
- TypeScript / JavaScript (ES6)
- HTML5 / CSS3
Other tools:
- Prettier
- ESLint (Airbnb config)
First, run the development server:
npm run dev
# or
yarn devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.
The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.
To run Jest,
npm test
or
npm run test To run Cypress,
npm run cypressError image: Image by Christelle Olivier from Pixabay
Placeholder image: Photo by Anika Mikkelson on Unsplash
Clapperboard imagee: Image by Clker-Free-Vector-Images from Pixabay
App Store and App Store logo are trademarks of Apple Inc.
Google Play and the Google Play logo are trademarks of Google LLC.
Microsoft Store and Microsoft Store are trademarks of Microsoft.
Next.js documentations
React documentations
React Testing Library and Jest documentations
Cypress documentation
Redux documentation
TailwindCSS documentations
Tailwind components (for modal implementation) - www.tailwindcomponents.com
React testing crash course - https://www.youtube.com/watch?v=OVNjsIto9xM
Apple badge guideline - https://developer.apple.com/app-store/marketing/guidelines/
Google badge guideline - https://play.google.com/intl/en_us/badges/
Microsoft badge guideline - https://docs.microsoft.com/en-us/windows/uwp/publish/app-marketing-guidelines