General Site Functionality

GitHub is the world’s largest platform for developers to host, review, and collaborate on code. It provides access to millions of repositories and open source projects. Using the GitHub REST API, we can fetch real-time data such as trending repositories, author details, programming languages, and star counts.
Hacker News is a social news platform focused on technology, startups, and programming. It is run by Y Combinator and allows users to post, upvote, and comment on tech-related articles. With the Hacker News Firebase API, we can retrieve posts, comments, timestamps, and article metadata in real time.
Wikipedia is a free, collaborative online encyclopedia with content created and maintained by volunteers. It contains structured and unstructured information across nearly every topic. I used the MediaWiki Action API to query terms used in GitHub's repo data to get a new search result in a popup/modal (see the rainbow-colored language button in almost any GitHub repo card).
I'm Sara Sjödin Scolari, a developer passionate about turning complex data into clear, meaningful experiences. This mashup was created as a hands-on exploration of how APIs can be securely combined, visualized, and styled using modern web technologies. It gave me the opportunity to deepen my skills in areas like responsive design, accessibility, and build automation with tools like Parcel, SCSS, and vanilla JavaScript — all without using frontend frameworks.
📂 GitHub API link searching for "Java"
├── total_count: (number - total matching repositories)
├── incomplete_results: (boolean - true if some results are missing)
└── items: (array of repository objects)
├── id: (number - unique repo ID)
├── node_id: (string - global GraphQL ID)
├── name: (string - repo name, e.g. "react")
├── full_name: (string - "owner/repo", e.g. "facebook/react")
├── owner: (object)
│ ├── login: (string - username)
│ ├── id: (number)
│ ├── avatar_url: (string - image URL)
│ └── html_url: (string - link to profile)
├── html_url: (string - link to repo)
├── description: (string - repo description)
├── fork: (boolean - true if it's a fork)
├── created_at: (string - ISO 8601 date)
├── updated_at: (string - ISO 8601 date)
├── pushed_at: (string - ISO 8601 date)
├── stargazers_count: (number - stars)
├── watchers_count: (number - watchers)
├── language: (string - main language, e.g. "Java")
├── forks_count: (number)
├── open_issues_count: (number)
├── license: (object or null)
│ └── name: (string - license name)
└── topics: (array of strings - requires preview header to show)
📂Algolia API link searching for "Java"
├── hits: (array of objects)
│ ├─ _highlightResult
│ │ ├── author: object
│ │ ├── title: object
│ │ └── url: object
│ ├── _tags: (array of strings)
│ ├── author: (string)
│ ├── children: (array of numbers)
│ ├── created_at: (string - ISO 8601 date)
│ ├── created_at_i: (number - Unix timestamp)
│ ├── num_comments: (number)
│ ├── objectID: (string)
│ ├── points: (number)
│ ├── story_id: (number)
│ ├── title: (string)
│ ├── updated_at: (string - ISO 8601 date)
│ └── url: (string)
├── hitsPerPage: (number - max 20 hits per page)
├── nbHits: (number - total results that match the search)
├── nbPages: (number - total max pages = 50)
├── page: (number - current page index)
├── params: (string - search string parameters)
├── processingTimeMS: (number - milliseconds to process search)
└── query: (string - the actual search word used)
📂 Wikipedia API link searching for "Java"
├── batchcomplete: (string - "true" if batch is complete)
├── continue: (object - for pagination)
│ └── sroffset: (number - offset for next page)
└── query
└── search: (array of search result objects)
├── ns: (number - namespace, 0 = main/articles)
├── title: (string - article title)
├── pageid: (number - unique ID for the page)
├── size: (number - page size in bytes)
├── wordcount: (number - number of words)
├── snippet: (string - HTML fragment of matched text)
├── timestamp: (string - ISO 8601 date last edited)