Giter Club home page Giter Club logo

github-avatar-viewer's Introduction

GitHub Avatar Viewer

A React web application that enables users to input a GitHub username and displays the corresponding user avatar fetched from the GitHub API. The application incorporates debouncing to enhance the user experience by preventing excessive API calls.

Technologies Used

  • React
  • Vite

Features

  • GitHub Avatar Display: Input a GitHub username and see the user's avatar instantly.
  • Debouncing for Improved Performance: Utilizes a custom hook (useDebounce) to implement debouncing, reducing API calls during rapid input changes.

Table of Contents

Getting Started

To explore the projects locally, follow these steps:

  1. Clone the repository: git clone https://github.com/MohdShoaib530/github-avatar-viewer.git
  2. Navigate to the specific project directory: cd project1 (replace project1 with the desired project folder).
  3. Install project dependencies: npm install `.
  4. Start the development server: npm run dev .
  5. Open the project in your preferred web browser at http://localhost:3000.
  6. Enter a GitHub username in the input field, and the app will display the corresponding avatar.

Custom Hook: useDebounce

The application employs a custom hook called useDebounce to delay API calls and ensure optimal performance, especially during rapid input changes.

How to Run Projects

Each project has its own set of instructions for running. Please refer to the project's README or documentation for specific details.

Contributing

Contributions to this collection of React projects are welcome! If you have a new project, improvement, or bug fix, follow these steps:

  1. Fork the repository.
  2. Create a new branch: git checkout -b feature-new-project.
  3. Add your project or make your changes.
  4. Commit your changes: git commit -m 'Add new project'.
  5. Push to the branch: git push origin feature-new-project.
  6. Submit a pull request.

Please follow the contribution guidelines for more details.

Happy coding and exploring React projects!

github-avatar-viewer's People

Contributors

mohdshoaib530 avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.