MetaBnB | HNG9 Project 3
A pixel perfect implementation of the design below, mobile responsiveness at developer's discretion.
Design
Technologies used
- Reactjs
- Material UI
Project structure
- /
index.html
- Root document - /public - static assets like favicon
- /src - source codes
main.jsx
- app entry point- ./components - UI components
- ./brand - brand components like logo link
- ./display - display components e.g hero, card
- ./icons - SVG icons (as JSX components)
- ./input - input components such as Button
- ./layout - layout components e.g NavBar, Footer
- ./modals - modals or popups e.g MenuModal
- ./images - image assets
- ./common - common images like hero image
- ./metaplaces - images used for meta place cards
- ./routes - app routes or pages
- ./utils - various utilities - utilities
- ./assets - asset compositions like image getters, link getters
- ./hooks - custom hooks, e.g,
useScroll
,useImages
Deployment
Deployed with Vercel https://metabnb-kael.vercel.app/