146 lines
6.9 KiB
HTML
146 lines
6.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Open Learning Hub</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="container">
|
|
<h1>Open Learning Hub</h1>
|
|
<p>Your gateway to free educational resources across the web.</p>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="container">
|
|
<section id="tip-section">
|
|
<h2>💡 Tip of the Day</h2>
|
|
<p id="daily-tip">Loading tip...</p>
|
|
<button id="new-tip-btn">Get Another Tip</button>
|
|
</section>
|
|
|
|
<section id="resources">
|
|
<h2>Educational Resources</h2>
|
|
<div class="filter-controls">
|
|
<button class="filter-btn active" data-filter="all">All</button>
|
|
<button class="filter-btn" data-filter="coding">Coding</button>
|
|
<button class="filter-btn" data-filter="science">Science</button>
|
|
<button class="filter-btn" data-filter="math">Math</button>
|
|
<button class="filter-btn" data-filter="humanities">Humanities</button>
|
|
<button class="filter-btn" data-filter="languages">Languages</button>
|
|
<button class="filter-btn" data-filter="courses">Online Courses</button>
|
|
</div>
|
|
|
|
<div class="resource-grid">
|
|
<!-- Coding -->
|
|
<article class="card" data-category="coding">
|
|
<h3>freeCodeCamp</h3>
|
|
<p>Learn to code for free with interactive lessons and projects.</p>
|
|
<a href="https://www.freecodecamp.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="coding">
|
|
<h3>MDN Web Docs</h3>
|
|
<p>Resources for developers, by developers. The bible of web dev.</p>
|
|
<a href="https://developer.mozilla.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="coding">
|
|
<h3>GitHub</h3>
|
|
<p>The world's largest platform for software development and version control.</p>
|
|
<a href="https://github.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
|
|
<!-- Science -->
|
|
<article class="card" data-category="science">
|
|
<h3>NASA</h3>
|
|
<p>Explore the universe with images, videos, and news from NASA.</p>
|
|
<a href="https://www.nasa.gov" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="science">
|
|
<h3>National Geographic</h3>
|
|
<p>World leader in geography, cartography and exploration.</p>
|
|
<a href="https://www.nationalgeographic.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="science">
|
|
<h3>Nature</h3>
|
|
<p>Leading international weekly journal of science.</p>
|
|
<a href="https://www.nature.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
|
|
<!-- Math -->
|
|
<article class="card" data-category="math">
|
|
<h3>Khan Academy</h3>
|
|
<p>Free, world-class education for anyone, anywhere.</p>
|
|
<a href="https://www.khanacademy.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="math">
|
|
<h3>Wolfram MathWorld</h3>
|
|
<p>The web's most extensive mathematics resource.</p>
|
|
<a href="https://mathworld.wolfram.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="math">
|
|
<h3>Desmos</h3>
|
|
<p>Beautiful, free online graphing calculator.</p>
|
|
<a href="https://www.desmos.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
|
|
<!-- Humanities -->
|
|
<article class="card" data-category="humanities">
|
|
<h3>Project Gutenberg</h3>
|
|
<p>A library of over 60,000 free eBooks.</p>
|
|
<a href="https://www.gutenberg.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="humanities">
|
|
<h3>Smithsonian</h3>
|
|
<p>Official website of the Smithsonian Institution.</p>
|
|
<a href="https://www.si.edu" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="humanities">
|
|
<h3>Internet Archive</h3>
|
|
<p>Non-profit library of millions of free books, movies, software, and music.</p>
|
|
<a href="https://archive.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
|
|
<!-- Languages -->
|
|
<article class="card" data-category="languages">
|
|
<h3>Duolingo</h3>
|
|
<p>The world's most popular way to learn a language. It's 100% free.</p>
|
|
<a href="https://www.duolingo.com" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="languages">
|
|
<h3>BBC Languages</h3>
|
|
<p>Archived but excellent resources for learning 40 languages.</p>
|
|
<a href="https://www.bbc.co.uk/languages/" target="_blank">Visit Site</a>
|
|
</article>
|
|
|
|
<!-- Online Courses -->
|
|
<article class="card" data-category="courses">
|
|
<h3>Coursera</h3>
|
|
<p>Build skills with courses, certificates, and degrees online from world-class universities.</p>
|
|
<a href="https://www.coursera.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="courses">
|
|
<h3>edX</h3>
|
|
<p>Access 2000+ free online courses from 140 leading institutions worldwide.</p>
|
|
<a href="https://www.edx.org" target="_blank">Visit Site</a>
|
|
</article>
|
|
<article class="card" data-category="courses">
|
|
<h3>MIT OpenCourseWare</h3>
|
|
<p>A web-based publication of virtually all MIT course content.</p>
|
|
<a href="https://ocw.mit.edu" target="_blank">Visit Site</a>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<div class="container">
|
|
<p>© 2025 Open Learning Hub.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|