{"id":19543277,"url":"https://github.com/codewithalamin/advice-generator-app","last_synced_at":"2026-02-25T22:04:54.087Z","repository":{"id":177626129,"uuid":"660621890","full_name":"CodeWithAlamin/Advice-generator-app","owner":"CodeWithAlamin","description":"Generate random quotes of advice with the Advice Slip API.","archived":false,"fork":false,"pushed_at":"2024-10-30T12:48:05.000Z","size":359,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-19T18:14:44.999Z","etag":null,"topics":["advice-api","advice-generator","advice-generator-app","adviceslip-api","codepapa360","codewithalamin","css","front-end-development","frontend","frontend-mentor","html","javascript","javascript-vanilla","quote-generator","sass"],"latest_commit_sha":null,"homepage":"https://advice-generator-app-alamin.netlify.app/","language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/CodeWithAlamin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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}},"created_at":"2023-06-30T12:31:42.000Z","updated_at":"2024-10-30T13:39:14.000Z","dependencies_parsed_at":null,"dependency_job_id":"c6a5b278-e749-44bc-a26d-710db9c86cf2","html_url":"https://github.com/CodeWithAlamin/Advice-generator-app","commit_stats":null,"previous_names":["codepapa360/advice-generator-app","codewithalamin/advice-generator-app"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/CodeWithAlamin/Advice-generator-app","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FAdvice-generator-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FAdvice-generator-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FAdvice-generator-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FAdvice-generator-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CodeWithAlamin","download_url":"https://codeload.github.com/CodeWithAlamin/Advice-generator-app/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FAdvice-generator-app/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29842910,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-25T21:18:31.832Z","status":"ssl_error","status_checked_at":"2026-02-25T21:18:29.265Z","response_time":61,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["advice-api","advice-generator","advice-generator-app","adviceslip-api","codepapa360","codewithalamin","css","front-end-development","frontend","frontend-mentor","html","javascript","javascript-vanilla","quote-generator","sass"],"created_at":"2024-11-11T03:18:11.764Z","updated_at":"2026-02-25T22:04:54.063Z","avatar_url":"https://github.com/CodeWithAlamin.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eAdvice generator app\u003c/h1\u003e\n\u003cdiv align=\"center\"\u003e\n\nChallenge from [Frontend Mentor](https://www.frontendmentor.io/challenges)\n\n\u003c/div\u003e\n\n\u003c!-- Badges --\u003e\n\u003cdiv align=\"center\"\u003e\n\n\u003c!-- Live --\u003e\n\u003ca href=\"https://advice-generator-app-alamin.netlify.app/\"\u003e\n    \u003cimg src=\"https://custom-icon-badges.demolab.com/badge/Live%20Demo-blue?style=for-the-badge\u0026logo=live360\u0026labelColor=666666\" alt=\"Live Demo\" /\u003e\n\u003c/a\u003e\n\n\u003c!-- Frontend Mentor --\u003e\n\u003ca href=\"https://www.frontendmentor.io/solutions/advice-generator-app-SHZi_xbXir\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Frontendmentor-100000?style=for-the-badge\u0026logo=frontendmentor\u0026logoColor=white\u0026labelColor=666666\u0026color=2490A9\"  alt=\"FrontendMentor\"\u003e\n\u003c/a\u003e\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\u003c!-- Status --\u003e\n\n\u003c!-- \u003cimg src=\"https://img.shields.io/badge/Status-Incomplete-red?style=flat\" alt=\"Status\" /\u003e --\u003e\n\n\u003cimg src=\"https://img.shields.io/badge/Status-Completed-success?style=flat\" alt=\"Status\" /\u003e\n\n\u003c!-- Liceensee --\u003e\n\u003cimg src=\"https://img.shields.io/badge/License-MIT-blue?style=flat\" alt=\"License\" /\u003e\n\u003c/div\u003e\n\n\u003chr\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n\u003cp\u003e\nThis project uses the \u003ca href=\"https://api.adviceslip.com/\"\u003eAdvice Slip API\u003c/a\u003e to generate random quotes of advice. The project is written in `JavaScript` and uses the `fetch()` API to make requests to the \u003ca href=\"https://api.adviceslip.com/\"\u003eAdvice Slip API\u003c/a\u003e. The app features a smooth transition effect when displaying the advice, creating an engaging user experience.\n\u003c/p\u003e\n\n\u003c!-- Screenshot --\u003e\n\u003ca align=\"center\" href=\"https://advice-generator-app-alamin.netlify.app/\"\u003e\n\n![Screenshot](./screenshots/Advice-generator-app-screenshot-CodeWithAlamin.png)\n\n\u003c/a\u003e\n\n\u003c/div\u003e\n\n## The challenge\n\nUsers should be able to:\n\n- View the optimal layout for the app depending on their device's screen size\n- See hover states for all interactive elements on the page\n- Generate a new piece of advice by clicking the dice icon\n\n## Built with\n\n- Semantic HTML5 markup\n- Mobile-first workflow\n- CSS custom properties\n- JavaScript\n- NPM\n- [Webpack - a module bundler](https://webpack.js.org/)\n- [Advice Slip API](https://api.adviceslip.com/)\n\n## What I Learned\n\nIn the process of developing the Advice Generator App, I expanded my skills and knowledge in various aspects of web development. Working with the Advice Slip API allowed me to gain hands-on experience with integrating third-party APIs into my projects. I deepened my understanding of `asynchronous` JavaScript and utilized the `fetch()` API to efficiently retrieve data from the API. Overall, this project provided an opportunity to sharpen my `JavaScript` skills, API integration capabilities, and UI design techniques, further advancing my expertise in web development.\n\n## Installation\n\n- Clone this repo:\n\n```sh\ngit clone https://github.com/CodeWithAlamin/Advice-generator-app.git\n```\n\n- Install dependencies:\n\n```sh\nnpm install\n```\n\n- Build command:\n\n```sh\nnpm run build\n```\n\n- Live server:\n\n```sh\nnpm start\n```\n\n## Author\n\n\u003cb\u003e👤 Alamin\u003c/b\u003e\n\n- Twitter - [@CodeWithAlamin](https://www.twitter.com/CodeWithAlamin)\n- LinkedIn - [@CodeWithAlamin](https://www.linkedin.com/in/CodeWithAlamin)\n- Frontend Mentor - [@CodeWithAlamin](https://www.frontendmentor.io/profile/CodeWithAlamin)\n- Github: [@CodeWithAlamin](https://github.com/CodeWithAlamin)\n\nFeel free to contact me with any questions or feedback!\n\n## Show your support\n\nGive a ⭐️ if you liked this project!\n\n## Acknowledgments\n\nSpecial thanks to Frontend Mentor for providing such an amazing platform to practice and improve my frontend skills.\n\n## License\n\nThis project is licensed under the [MIT](https://github.com/CodeWithAlamin/Advice-generator-app/blob/main/LICENSE.md) license, which means you can use, modify, and distribute the code as you wish. If you have any questions or feedback, feel free to reach out. Thank you for considering my code!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodewithalamin%2Fadvice-generator-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodewithalamin%2Fadvice-generator-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodewithalamin%2Fadvice-generator-app/lists"}