{"id":28928845,"url":"https://github.com/dalascript/news-homepage","last_synced_at":"2025-08-20T05:16:16.372Z","repository":{"id":291980901,"uuid":"973667707","full_name":"DalaScript/news-homepage","owner":"DalaScript","description":"Part 28 | News homepage Challenge by Fronendmentor.io \u0026 Coded by Dala","archived":false,"fork":false,"pushed_at":"2025-05-25T07:05:44.000Z","size":1489,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-31T15:36:19.518Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://news-homepage-five-sand.vercel.app","language":"JavaScript","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/DalaScript.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-04-27T13:40:39.000Z","updated_at":"2025-05-28T21:49:56.000Z","dependencies_parsed_at":null,"dependency_job_id":"702bd9e7-172e-467d-98a9-90bdc08a084f","html_url":"https://github.com/DalaScript/news-homepage","commit_stats":null,"previous_names":["dalascript/news-homepage"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/DalaScript/news-homepage","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DalaScript%2Fnews-homepage","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DalaScript%2Fnews-homepage/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DalaScript%2Fnews-homepage/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DalaScript%2Fnews-homepage/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DalaScript","download_url":"https://codeload.github.com/DalaScript/news-homepage/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DalaScript%2Fnews-homepage/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":271268859,"owners_count":24730026,"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-20T02:00:09.606Z","response_time":69,"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":[],"created_at":"2025-06-22T14:14:37.696Z","updated_at":"2025-08-20T05:16:15.949Z","avatar_url":"https://github.com/DalaScript.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# News homepage solution | Frontend Mentor\n\nThis is a solution to the [News homepage challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/news-homepage-H6SWTa1MFl). Frontend Mentor challenges help you improve your coding skills by building realistic projects. \n\n## Table of contents\n\n- [Overview](#overview)\n  - [The challenge](#the-challenge)\n  - [Screenshot](#screenshot)\n  - [Links](#links)\n- [My process](#my-process)\n  - [Built with](#built-with)\n  - [What I learned](#what-i-learned)\n  - [Continued development](#continued-development)\n  - [Useful resources](#useful-resources)\n- [Author](#author)\n  - [Connect with Me](#Connect-with-Me)\n  - [Coding Profiles](#Coding-Profiles)\n\n## Overview\n\n### The challenge\n\nUsers should be able to:\n\n- View the optimal layout for the interface depending on their device's screen size\n- See hover and focus states for all interactive elements on the page\n\n### Screenshot\n\n![screenshot of the project's webpage](./src/assets/images/screenshot/screenshot.jpg)\n\n### Links\n\n- [Solution URL](https://github.com/DalaScript/news-homepage)\n- [Live Site URL](https://news-homepage-five-sand.vercel.app/)\n\n## My process\n\n### Built with\n\n- [React](https://reactjs.org/) - JS library\n- React Hooks – useState, useEffect, etc.\n- JavaScript (ES6+) – For component logic and interactivity\n- CSS Modules / Plain CSS (based on your file structure)\n- Flexbox\n- Mobile-first workflow\n\n\n### What I learned\n\nThis project was my first complete React build done independently, and it was a solid step in structuring components and thinking in terms of reusable UI blocks. I practiced:\n\n - Building a fully responsive navigation system with a hamburger toggle, `aria-hidden`, and overlay logic for mobile devices.\n\n - Improved my state management using useState\n\n - Structuring reusable data-driven components like the `\u003cCard /\u003e`, and using `map()` efficiently to render content from arrays.\n\n - Maintaining a clean separation between presentation and logic, splitting everything into meaningful folders and files.\n\n### Continued development\n\nam currently focused on advancing my skills in both frontend and backend development. On the frontend side, I am exploring modern frameworks and libraries such as React, Svelte, Tailwind CSS, and Ant Design to build responsive and dynamic user interfaces.\n\nFor backend development, I am working with technologies including Express.js, Next.js, Prisma, MySQL, and TypeScript to gain a deeper understanding of server-side logic, APIs, and database management.\n\nMy goal is to become a well-rounded developer by continuously learning and applying these tools in real-world projects.\n\n### Useful resources\n\n- [ChatGPT](https://chatgpt.com/) - He is my hero, if I need something fast, if I can't understand something, or if I can't find it on the internet, I always ask him.\n- [W3Schools](https://www.w3schools.com/) - This is my favorite documentation platform I've been using since I started programming, it's the best explained resource.\n- [MDN](https://developer.mozilla.org/en-US/) - This is also my favorite documentation platform, which I've been using a lot lately.\n- [YouTube](https://www.youtube.com/) - I'm always looking for news and listening to other developers, sharing their experiences so that I can see many different solutions to a problem.\n\n## Author\n\n### Connect with Me\n\n- [Instagram](https://www.instagram.com/DalaScript)\n- [YouTube](https://www.youtube.com/@DalaScript)\n\n### Coding Profiles\n\n- [freeCodeCamp](https://www.freecodecamp.org/DalaScript)\n- [FrontendMentor](https://www.frontendmentor.io/profile/DalaScript)\n- [GitHub](https://github.com/DalaScript)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdalascript%2Fnews-homepage","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdalascript%2Fnews-homepage","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdalascript%2Fnews-homepage/lists"}