instagram-clone

KO | EN

Minimalist Open Source Repository Search Engine

gitlite — search

#typescript #ai-agents #deepseek-harness #dsh-plugin #open-source #ai #cli #claude-code #windows #codex #developer-tools #dsh

instagram-clone

★ 99 Open GitHub ↗

Instagram Clone made with HTML, CSS and JS, for study purposes.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Instagram Clone

> Responsive Instagram UI Clone

This project is a clone of the [Instagram UI](https://instagram.com). I made it to study and improve my skills with HTML and CSS, and learn new concepts, like layouts, responsiveness, positioning and some JS concepts. Any feedback, opinions or suggestions is very welcome!

The latest update includes some nice new features, such as the gradient border and scroll buttons in stories, and the possibility to add more than one media to the post content, plus, of course, a major overhaul of the UI design!

- **[Live Preview](https://leocosta1.github.io/instagram-clone/)**

## 🤓 Improved Skills

- Layout (Flexbox);
- Positioning;
- Semantic HTML;
- Responsiveness (Media Queries, Relative Lengths);
- Light/Dark Theme;
- SVG Usage;
- BEM Methodology;
- Scroll Snapping;
- Events;
- LocalStorage;
- Intersection Observer;

## ✅ ToDo

- [ ] Refactor CSS (Maybe add SASS).

## ⚙ Dev Setup (VS Code)

1. Clone the project.
2. Open the folder with ``Visual Studio Code``.
3. Install ``Live Preview`` extension.
4. Right click **index.html** > ``Live Preview: Show Preview``.
5. Open the ``localhost:3000`` address in your favorite browser.

## ℹ Infos

Made by Leonardo Costa 🙂

Distributed under the MIT License. See ``LICENSE`` for more information.

instagram-clone

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README