/twitter-clone

A responsive Twitter clone built with TypeScript, React.js and Styled components.

Primary LanguageTypeScript

Twitter | UI Clone

Responsivity powered by flexbox and
mobile first strategy

PRs welcome! License

Github - João Bispo Linkedin - João Bispo Email - João Bispo

Project   |    Technologies   |    Layout   |    Challenges   |    How to contribute


💻 Project

The Twitter Clone is a project that a developer can use to learn in the pratice how to use flexbox and mobile first strategy, that prioritizes the responsive design of the web applications, primarily for mobile devices (smartphones, tablets, etc...) and from small to large screens (desktop, large tablet, large desktop, etc...).

🚀 Technologies

The project is based on the following technologies:

  • ✨ TypeScript — Static typing for JavaScript.

  • ⚛ React — A JavaScript library for building user interfaces.

  • 💅 Styled Components — A toolkit for writing CSS-in-JS components.

  • 📝 Lint — ESlint/Prettier/Editor Config

    • 📦 ESLint — A fully pluggable tool for identifying and reporting on patterns in JavaScript.
    • 📦 Prettier — A tool to keep code style consistent.
    • 📦 Editor Config — A tool to maintain consistent coding styles between different editors and IDEs.

🔖 Layout

  • Comming soon...

🎯 Challenges

  • Abstraction of the CSS.
  • Expand the knowledge of flexbox.
  • Understand the responsive design.
  • Study the mobile first strategy (PROS and CONS).
  • Develop an app to all diferent devices as possible.

♻️ How to contribute

  • Fork this repository;
  • Create a new branch with your feature: git checkout -b feature/my-feature;
  • Commit your changes: git commit -m 'feat: awesome feature';
  • Push to your branch: git push origin feature/my-feature.

Once your pull request has been merged, you can delete your branch.

To setup app, read this file setup.md


Made with 💙 & ☕ by João Bispo😎