{"id":30114263,"url":"https://github.com/simandrew/responsive-navbar-reactjs","last_synced_at":"2025-08-10T07:39:53.145Z","repository":{"id":307490214,"uuid":"1028303003","full_name":"SimAndrew/responsive-navbar-reactjs","owner":"SimAndrew","description":"Responsive Navbar ","archived":false,"fork":false,"pushed_at":"2025-07-31T12:55:58.000Z","size":54,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-31T16:22:44.475Z","etag":null,"topics":["nav-bar","navbar","react-icons","reactjs","responsive-design","useref-hook"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SimAndrew.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-29T10:26:44.000Z","updated_at":"2025-07-31T12:56:02.000Z","dependencies_parsed_at":"2025-07-31T16:25:07.554Z","dependency_job_id":"99f16db3-b251-49d4-bf84-40330c6dd298","html_url":"https://github.com/SimAndrew/responsive-navbar-reactjs","commit_stats":null,"previous_names":["simandrew/responsive-navbar-reactjs"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/SimAndrew/responsive-navbar-reactjs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimAndrew%2Fresponsive-navbar-reactjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimAndrew%2Fresponsive-navbar-reactjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimAndrew%2Fresponsive-navbar-reactjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimAndrew%2Fresponsive-navbar-reactjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SimAndrew","download_url":"https://codeload.github.com/SimAndrew/responsive-navbar-reactjs/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimAndrew%2Fresponsive-navbar-reactjs/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269693405,"owners_count":24460234,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-10T02:00:08.965Z","response_time":71,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nav-bar","navbar","react-icons","reactjs","responsive-design","useref-hook"],"created_at":"2025-08-10T07:39:29.746Z","updated_at":"2025-08-10T07:39:53.124Z","avatar_url":"https://github.com/SimAndrew.png","language":"CSS","readme":"## Responsive Navbar\n\n### About:\n\nThe navigation bar is fully responsive. On larger screens, the navigation links are displayed inline, while on smaller screens, a toggle button appears to show or hide the menu. It includes links to various sections, a logo, and social icons. The project demonstrates the use of React hooks, particularly the `useRef` hook for managing the dropdown menu state.\n\nYou can try here: [responsive-nav-bar-reactjs.netlify.app](https://responsive-nav-bar-reactjs.netlify.app/)\n\n### Sample task, photo:\n\n![image](https://github.com/user-attachments/assets/c48c5123-d963-4725-8481-7b70907e69dd)\n\n![image1](https://github.com/user-attachments/assets/86811145-3f48-4c66-80da-a1fd10d50a7a)\n\n![image2](https://github.com/user-attachments/assets/076cd080-3bfc-4ba5-9536-61b9682833d2)\n\n### Technologies, Libraries:\n\n- [React JS](https://react.dev/)\n- [Vite JS](https://vitejs.dev/), [ESLint](https://eslint.org/), [Prettier](https://prettier.io/)\n- [React Icons](https://react-icons.github.io/react-icons/) is a popular open-source library that provides a collection of accessible SVG icons for React applications.\n- [useRef Hook](https://react.dev/reference/react/useRef) The useRef Hook in React allows for the creation of mutable \"ref\" objects that persist across component renders without triggering re-renders when their current property is updated.\n\n### Run the app:\n\n- Clone a project: `git clone`\n\n```\ngit clone https://github.com/SimAndrew/responsive-navbar-reactjs.git\n```\n\n- Open project code in your editor.\n- Install the dependencies, enter into the terminal:\n\n```\nnpm install\n```\n\n- Run the project, enter into the terminal:\n\n```\nnpm run dev\n```","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimandrew%2Fresponsive-navbar-reactjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsimandrew%2Fresponsive-navbar-reactjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimandrew%2Fresponsive-navbar-reactjs/lists"}