In this project, you will be asked to create a bookmark management application.
Once on the site, a user can :
- Upload new bookmarks;
- List all bookmarks;
Requirements :
-
The form supports only two types of links:
- Vimeo video (ex: https://vimeo.com/565486457)
- Flickr photo (ex: https://www.flickr.com/photos/feuilllu/45771361701/)
-
The following information will be displayed for a Vimeo link :
- Video preview (if available)
- URL
- Video title
- Author
- Date added to application (one hour ago, 2 minutes ago...)
- Date published on Vimeo (November 3, 2020)
- Duration (hh:mm:ss)
-
The following information will be displayed for a Flickr link :
- Preview photo
- URL
- Photo title
- Author
- Date added to application (one hour ago, 2 minutes ago...)
- Date published on Flickr (November 3, 2020)
- Width x Height
- A delete button will also be present for each link.
-
Constraints:
- The application must be built using: React and Hooks
- Use of Typescript is also a prerequisite.
- Only React is authorized as a third-party library (no redux, axios, moment...).
npm run install
# or
yarn install
# or
pnpm install
npm run dev
# or
yarn dev
# or
pnpm dev
Open http://localhost:5173/ with your browser to see the result.
You can start editing the page by modifying src/App.tsx
. The page auto-updates as you edit the file.
To learn more about Vite.js, take a look at the following resources:
- Vite.js Documentation - learn about Vite.js.