{"id":49291273,"url":"https://github.com/freddysae0/harbour-space","last_synced_at":"2026-04-26T00:04:50.791Z","repository":{"id":234392445,"uuid":"787055426","full_name":"freddysae0/harbour-space","owner":"freddysae0","description":"Front-end challenge for Harbour Space University ","archived":false,"fork":false,"pushed_at":"2024-04-19T12:39:08.000Z","size":13139,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-04-20T06:38:27.227Z","etag":null,"topics":["animations","css","css-animations","javascript","landing-page","pinia","pinia-vuejs","vue","vue3","vuejs"],"latest_commit_sha":null,"homepage":"https://hschallenge.netlify.app","language":"Vue","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/freddysae0.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}},"created_at":"2024-04-15T20:00:32.000Z","updated_at":"2024-04-19T12:12:58.000Z","dependencies_parsed_at":"2024-04-19T06:48:46.877Z","dependency_job_id":null,"html_url":"https://github.com/freddysae0/harbour-space","commit_stats":null,"previous_names":["freddysae0/harbour-space"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/freddysae0/harbour-space","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/freddysae0%2Fharbour-space","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/freddysae0%2Fharbour-space/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/freddysae0%2Fharbour-space/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/freddysae0%2Fharbour-space/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/freddysae0","download_url":"https://codeload.github.com/freddysae0/harbour-space/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/freddysae0%2Fharbour-space/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32280982,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-25T18:29:39.964Z","status":"ssl_error","status_checked_at":"2026-04-25T18:29:32.149Z","response_time":59,"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":["animations","css","css-animations","javascript","landing-page","pinia","pinia-vuejs","vue","vue3","vuejs"],"created_at":"2026-04-26T00:04:50.612Z","updated_at":"2026-04-26T00:04:50.782Z","avatar_url":"https://github.com/freddysae0.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Challenge of Harbour Space 🚀\n\nThis project is a responsive landing page, imitating the design of [Harbour Space](https://harbour.space). It features advanced animations using CSS + JavaScript. The project is built with:\n\n- [Vue.js 3](https://vuejs.org)\n- [Pinia](https://pinia.vuejs.org/) for state management\n- [Tailwind CSS](https://tailwindcss.com)\n- [Sass](https://sass-lang.com) (minimal use).\n\nYou can view the project live at [Freddy's HS Challenge](https://hschallenge.netlify.app/).\n\n## Desktop Preview 🖥️\n\nUpon startup, the site prompts the user to select an API for a specific scholarship. Due to time constraints, the API is only consumed and displayed in the first section, [HeroSection.vue](./src/sections/HeroSection.vue). However, data handling for displaying it throughout the project is implemented using [Pinia](https://pinia.vuejs.org/).\n\nThe API base url is located in the `/src/api.js` file:\n\n```js\nexport const apiListUrl =\n  \"https://pre-prod.harbour.space/api/v1/scholarship_pages/\";\n```\n\nThe fetching to this route indicates us the different APIs available that we can show to the user, as shown in the following image:\n\n![Choose Api](./readme/choose-api.png)\n\nHere's a demonstration of the landing page:\n\n- ![Hero](./readme/hero.png)\n- ![About](./readme/about.png)\n- ![Testimonials Animation](./readme/testimonial-animation.gif)\n- ![FAQ](./readme/faq.png)\n- ![Footer](./readme/footer.png)\n- ![Button animation](./readme/button-animation.gif)\n\n#### Connectivity error\n\nThere is also this component that I hope if you are not intentionally looking to provoke it, you will never have to see it, it is activated if any API request fails, you can test it by running the project locally, and disconnecting from the Internet, it will be the first thing you will see when you open the project.\n\n- ![Error](./readme/error.png)\n\n## Mobile Preview 📱\n\n- ![Mobile preview](./readme/mobile-animation.gif)\n\n## Installing the Project 🛠️\n\nEnsure you have [Node.js](https://nodejs.org) and [npm](https://www.npmjs.com/) installed on your system. If you do, follow these steps:\n\n### Clone the Project\n\n```bash\ngit clone https://github.com/freddysae0/harbour-space.git\n```\n\n### Access the Project Folder\n\n```bash\ncd harbour-space\n```\n\n### Install Dependencies\n\n```bash\nnpm i\n```\n\n### Run the Project Locally\n\n```bash\nnpm run serve\n```\n\nIf successful, the project will run in development mode on your system.\n\n## Building the Project 🏗️\n\n### Compile and Minify for Production\n\n```bash\nnpm run build\n```\n\nThis `readme.md` wasn't generated by AI; it was carefully crafted, including compressing GIFs with the Cuba's slow internet 😂. All information is organized for clarity. If you're interested in the project, consider leaving a star in the repo or following me. 🌟\n\nPS:\nThere is an [auto-generated pdf](./README.pdf), with the same content as this README.\n\n## Development Process ☕\n\n\u003cimg src=\"./readme/development.jpg\" width=\"500\"\u003e\n\n# That is all. Thanks for Reading!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffreddysae0%2Fharbour-space","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffreddysae0%2Fharbour-space","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffreddysae0%2Fharbour-space/lists"}