Wikipedia Viewer – FreeCodeCamp Project - Bojan Cvjetković

Project Overview
As part of my Front End Development Libraries certification from FreeCodeCamp, I developed the Wikipedia Viewer, a web application that allows users to search Wikipedia dynamically and retrieve relevant articles in real time. This project showcases my expertise in API integration, JavaScript, and responsive UI design, offering a smooth and interactive search experience.

🔗 Live Demo: Wikipedia Viewer

Project Features

✅ Real-Time Wikipedia Search

Fetches search results instantly from Wikipedia’s API based on user input.
Displays article titles, snippets, and direct links to full Wikipedia pages.

✅ Random Article Feature

Includes a “Random Article” button that redirects users to a completely random Wikipedia article for discovery and exploration.

✅ Dynamic & Interactive UI

Features real-time search suggestions as users type.
Clean, minimalist layout for distraction-free browsing.

✅ Fully Responsive & Mobile-Friendly

Designed using CSS flexbox and media queries to ensure seamless display on all devices.

✅ Fast & Lightweight

Optimized to deliver quick search results with minimal load time.

Technologies Used

📄 HTML5 – Structured, semantic markup for SEO and accessibility.
🎨 CSS3 – Styled with modern design principles for a clean, responsive layout.
⚡ JavaScript (ES6+) – Handles dynamic search queries and API requests.
🌍 Wikipedia API – Retrieves real-time Wikipedia content.

SEO Optimization & Benefits

This project is SEO-optimized with:

Semantic HTML structure for improved accessibility and indexing.
Fast-loading performance, ensuring smooth interaction.
Mobile-friendly design, increasing engagement and usability.
Dynamic content generation, enhancing user experience and retention.

Conclusion

The Wikipedia Viewer project demonstrates my ability to work with external APIs, JavaScript, and real-time data processing. It’s a great example of how modern front-end technologies can be used to create interactive, search-driven applications that enhance information accessibility.

🚀 Check out the live version here: Wikipedia Viewer