parent
9e8dd00f10
commit
244456759d
@ -0,0 +1,43 @@
|
|||||||
|
# Post Feed App
|
||||||
|
|
||||||
|
**Tier:** 2-Intermediate
|
||||||
|
|
||||||
|
Build a simple social media feed using HTML, CSS, and JavaScript (no backend).
|
||||||
|
Users should be able to create, view, edit, and manage posts containing an
|
||||||
|
image or video with a caption. Post data should persist in browser storage such
|
||||||
|
as IndexedDB.
|
||||||
|
|
||||||
|
## User Stories
|
||||||
|
|
||||||
|
- [ ] User can create a post with an image or video and a caption
|
||||||
|
- [ ] User can view a list of posts in a feed layout
|
||||||
|
- [ ] User can delete a post
|
||||||
|
- [ ] User data is persisted using browser storage (e.g. IndexedDB)
|
||||||
|
|
||||||
|
## Bonus features
|
||||||
|
|
||||||
|
- [ ] User can like posts
|
||||||
|
- [ ] User can comment on posts
|
||||||
|
- [ ] User can toggle dark mode
|
||||||
|
- [ ] User can edit posts
|
||||||
|
- [ ] Posts display timestamps
|
||||||
|
|
||||||
|
## Useful links and resources
|
||||||
|
|
||||||
|
- [HTML Reference - MDN](https://developer.mozilla.org/docs/Web/HTML)
|
||||||
|
- [CSS Reference - MDN](https://developer.mozilla.org/docs/Web/CSS)
|
||||||
|
- [JavaScript Reference - MDN](https://developer.mozilla.org/docs/Web/JavaScript)
|
||||||
|
- [DOM Manipulation - MDN](https://developer.mozilla.org/docs/Web/API/Document_Object_Model)
|
||||||
|
- [CSS Flexbox - CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
|
||||||
|
- [CSS Grid - CSS-Tricks](https://css-tricks.com/snippets/css/complete-guide-grid/)
|
||||||
|
- [Dark Mode - CSS-Tricks](https://css-tricks.com/a-complete-guide-to-dark-mode-on-the-web/)
|
||||||
|
- [File API - MDN](https://developer.mozilla.org/docs/Web/API/File_API/Using_files_from_web_applications)
|
||||||
|
- [FileReader - MDN](https://developer.mozilla.org/docs/Web/API/FileReader)
|
||||||
|
- [IndexedDB - MDN](https://developer.mozilla.org/docs/Web/API/IndexedDB_API)
|
||||||
|
- [localStorage - MDN](https://developer.mozilla.org/docs/Web/API/Window/localStorage)
|
||||||
|
- [sessionStorage - MDN](https://developer.mozilla.org/docs/Web/API/Window/sessionStorage)
|
||||||
|
|
||||||
|
## Example projects
|
||||||
|
|
||||||
|
- [Instagram](https://www.instagram.com/)
|
||||||
|
- [X (formerly Twitter)](https://x.com/)
|
||||||
Loading…
Reference in new issue