- The Github Finder is a web application built using HTML5, CSS3, and JavaScript that allows users to search for Github profiles using a Github username. The application makes use of the Github API to retrieve user data and display it on the web page.
- The application consists of a simple user interface that includes a search bar where users can enter a Github username to search for. Once a valid username is entered and the search button is clicked, the application sends a request to the Github API to retrieve user data, such as the user's name, profile picture, location, bio, number of followers, number of following, and number of public repositories.
- The retrieved data is then displayed on the web page in a clean and organized format using HTML5 and CSS3. To enhance the user experience, the application also makes use of Material UI, a popular CSS framework, to style the user interface and provide a consistent look and feel across all devices.
- To create a web application that allows users to search for Github profiles using a Github username.
- To provide a clean and organized user interface that displays Github user data in a readable format.
- To leverage the Github API to retrieve user data and demonstrate the power of API integration in web development.
- To showcase the skills and expertise of the developer in front-end web development, including HTML5, CSS3, and JavaScript.
- Develop a user-friendly interface that allows users to enter a Github username and retrieve user data.
- Integrate the Github API to retrieve user data, including the user's name, profile picture, location, bio, number of followers, number of following, and number of public repositories.
- Display the retrieved data on the web page using HTML5 and CSS3 in a clean and organized format.
- Optimize the application for performance and responsiveness to provide a seamless user experience.
- Provide clear and concise documentation to assist users in using the application.
- HTML5: This is a markup language used to structure content on the web page, including headings, paragraphs, links, and images.
- CSS3: This is a style sheet language used to define the visual appearance of the web page, including fonts, colors, layouts, and animations.
- JavaScript: This is a programming language used to add interactivity and functionality to the web page, including user input validation, event handling, and API integration.
- Github API: This is a REST API that allows developers to access Github data, including user profiles, repositories, and issues.
- Git : Git is a version control system that allows you to manage and track changes to your codebase. It helps you to collaborate with others and keep track of your project history.
- GitHub : GitHub is a web-based platform that allows you to host and manage your Git repositories. It provides a range of features, such as collaboration tools, issue tracking, and pull requests, to help you work on your project with others.
- Clone the Github Finder repository from GitHub using the following command in your terminal:
git clone https://github.com/<your-username>/github-finder.git. - Open the project folder in your code editor of choice, such as Visual Studio Code or Atom.
- Install any necessary dependencies by running the following command in your terminal:
npm install. - Create a Github API token by following the instructions provided by Github at https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token.
- Create a file named .env in the root folder of the project and add the following line, replacing with your Github API token:
REACT_APP_GITHUB_TOKEN=<your-token>. - Save the
.envfile.
- Sign In Page
