{"id":19543264,"url":"https://github.com/codewithalamin/base-apparel","last_synced_at":"2026-02-25T05:15:17.711Z","repository":{"id":154934014,"uuid":"625208182","full_name":"CodeWithAlamin/Base-Apparel","owner":"CodeWithAlamin","description":"Base Apparel coming soon page design challenge on Frontend Mentor.","archived":false,"fork":false,"pushed_at":"2024-10-30T12:06:32.000Z","size":2872,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-25T19:31:12.613Z","etag":null,"topics":["codepapa360","codewithalamin","coming-soon-page","css","design-challenge","email-validation","frontend-development","html","javascript","responsive-design","web-development"],"latest_commit_sha":null,"homepage":"https://base-apparel-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-04-08T11:55:11.000Z","updated_at":"2024-10-30T12:06:36.000Z","dependencies_parsed_at":"2025-01-08T19:11:04.463Z","dependency_job_id":"345a96b7-555d-4749-b321-b32670e777d6","html_url":"https://github.com/CodeWithAlamin/Base-Apparel","commit_stats":null,"previous_names":["codewithalamin/base-apparel"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/CodeWithAlamin/Base-Apparel","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FBase-Apparel","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FBase-Apparel/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FBase-Apparel/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FBase-Apparel/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CodeWithAlamin","download_url":"https://codeload.github.com/CodeWithAlamin/Base-Apparel/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CodeWithAlamin%2FBase-Apparel/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29811531,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-25T03:30:18.102Z","status":"ssl_error","status_checked_at":"2026-02-25T03:30:17.799Z","response_time":61,"last_error":"SSL_read: 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":["codepapa360","codewithalamin","coming-soon-page","css","design-challenge","email-validation","frontend-development","html","javascript","responsive-design","web-development"],"created_at":"2024-11-11T03:18:09.275Z","updated_at":"2026-02-25T05:15:17.676Z","avatar_url":"https://github.com/CodeWithAlamin.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eBase Apparel coming soon\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \u003ch3\u003e\n    \u003ca href=\"https://base-apparel-alamin.netlify.app/\"\u003e\n      🚀 Live Site\n    \u003c/a\u003e\n    |\n    \u003ca href=\"https://www.frontendmentor.io/solutions/base-apparel-coming-soon-page-w-sass-gE-9deBSNJ\"\u003e\n      💡 Solution\n    \u003c/a\u003e\n  \u003c/h5\u003e\n\u003c/div\u003e\n\n  \u003cp align=\"center\"\u003e\n    This is my solution for the Base Apparel coming soon page design challenge on Frontend Mentor. The objective was to recreate the design as accurately as possible with email validation. Take a look at the live site!\n  \u003c/p\u003e\n\n### Screenshot\n\n\u003ca align=\"center\" href=\"https://base-apparel-alamin.netlify.app/\"\u003e\n\n\u003cimg src=\"screenshots/Compared - Base Apparel coming soon - dark mode.png\"/\u003e\n\u003c/a\u003e\n\n### The challenge\n\nUsers should be able to:\n\n- View the optimal layout for the site depending on their device's screen size\n- See hover states for all interactive elements on the page\n- Receive an error message when the `form` is submitted if:\n  - The `input` field is empty\n  - The email address is not formatted correctly\n- **Bonus:** Dark mode toggle\n\n#### Built with\n\n- Semantic HTML5 markup\n- CSS custom properties\n- Flexbox\n- CSS Grid\n- JavaScript\n- Mobile-first workflow\n- NPM\n\n## Installation\n\n- Clone this repo:\n\n```sh\ngit clone https://github.com/CodeWithAlamin/Base-Apparel.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- Run command:\n\n```sh\nnpm start\n```\n\n### What I learned\n\nBuilding this project has provided me with valuable learning experiences. One of the challenges I encountered was implementing email validation using JavaScript, which involved learning about regular expressions and how to validate user input.\n\nAdditionally, I improved my layout skills by working with responsive images and using CSS Grid.\n\nOverall, this project has helped me to build on my existing knowledge and gain new insights.\n\n### Useful resources\n\n- [RegexMagic](https://www.regular-expressions.info/email.html) - This article by \u003cb\u003eJan Goyvaerts\u003c/b\u003e provides an in-depth explanation of how to use regular expressions to validate email addresses. The article not only explains how to write regular expressions for email validation but also covers the common mistakes made while writing regular expressions for email validation.\n\nIt provides clear and concise examples of regular expressions for email validation and also explains the logic behind each regular expression.\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\nI would like to express my gratitude to Frontend Mentor for providing this project idea and design. Their platform is an excellent resource for web developers looking to improve their skills.\n\n## License\n\nThis project is licensed under the [MIT](https://github.com/CodeWithAlamin/Base-Apparel/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%2Fbase-apparel","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodewithalamin%2Fbase-apparel","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodewithalamin%2Fbase-apparel/lists"}