index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" 
	integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
	<link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png">
	<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png">
	<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png">
	<link rel="icon" type="image/png" sizes="512x512" href="/assets/android-chrome-512x512.png">
	<link rel="icon" type="image/png" sizes="192x192" href="/assets/android-chrome-192x192.png">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="x-ua-compatible" content="ie=edge">
	<link rel="manifest" href="/site.webmanifest">
	<title>DevDum!</title>
	<link rel="stylesheet" href="style.css">
	<script src="script.js"></script>	
</head>
<body>
	<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9529936751172540"
				crossorigin="anonymous"></script>
<header>
		<div id="header">
 		<svg version="1.1" id="Capa_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px"
	 	viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"></svg> 	
		</div>
		<div id="mobileMenuToggle" title="Menu">Menu</div>
		<div id="headerLeft">
		<a href="/"><img alt="Home"  class="img-fluid" alt="Responsive image" title="Home" id="menuToggle" src="DevDum copy (1).png" width="190px"/></a>
		</div>
		<div id="headerRight">
			<nav>
				<ul>
					<li><a id="github" rel="nofollow" href="https://github.com/" target="_blank">GitHub</a></li>
					<li><a id="dailydev" rel="nofollow" href="https://app.daily.dev/" target="_blank">DailyDev</a></li>
					<li><a id="w3" rel="nofollow" href="https://www.w3schools.com/" target="_blank">W3Schools</a></li>
					<li><a id="mdn" rel="nofollow" href="https://developer.mozilla.org/en-US/" target="_blank">MDN WebDocs</a></li>
					<li><a id="stack" rel="nofollow" href="https://stackoverflow.com/" target="_blank">StackOverflow</a></li>
				</ul>
			</nav>
		</div>
</header> 
<div id="wrapall">
	<div id="sidebar">
		<div id="stickThis">
			<div id="sidebarContent">
				<!-- <div id="logo"><imd </h1>
				<h4>Less Searching. More Learning.</h4> --> 
				<aside>
					<div><a id="color1" href="html.html"><img  alt="HTML" title="HTML" src="icons/output-onlineimagetools-html.png"/></a></div>
					<div><a id="color2" href="style.html"><img alt="CSS" title="CSS" src="icons/output-onlineimagetools-css.png"/></a></div>
					<div><a id="color3" href="javascript.html"><img alt="JavaScript" title="Javascript" src="icons/output-onlineimagetools-js.png" width="53px"/></a></div>
					<div><a id="color4" href="bootstrap.html"><img alt="Bootstrap" title="Bootstrap" src="icons/output-onlineimagetools-bootstrap.png"/></a></div>
					<div><a id="color5" href="react.html"><img alt="React" title="React" src="icons/output-onlineimagetools-react.png"/></a></div>
					<div><a id="color6" href="nodejs.html"><img alt="Node" title="Node" src="icons/output-onlineimagetools-nodejs.png" width="50px"/></a></div>
					<div><a id="color7" href="api.html"><img alt="API" title="API" src="icons/output-onlineimagetools-api.png"/></a></div>
					<div><a id="color8" href="mysql.html"><img alt="SQL" title="SQL" src="icons/output-onlineimagetools-sql.png"/></a></div>
					<div><a id="color9" href="github.html"><img alt="GitHub" title="GitHub" src="icons/output-onlineimagetools-github.png"/></a></div>
					<div><a id="color10" href="youtube.html"><img alt="YouTube" title="YouTube" src="icons/output-onlineimagetools-youtube.png"/></a></div>
					<div><a id="color11" href="more.html"><img alt="More" title="More" src="icons/output-onlineimagetools-more.png" width="48px"/></a></div>
					<a class="back2Top" href="#"><code>⮝&nbsp;Back to&nbsp;Top&nbsp;⮝</code></a>
				</aside>
			</div>
		</div>
		<div id="stick-here"></div>
	</div>
	<div id="main">
		<section id="page">
			<main>
				<article id="yellow">
					<h1 class="display-2">DevDum<span class="vim-caret">!</span></h1>
					<h3><strong>Code Smarter. Not Harder.</strong></h3>
					<h4>Less searching more learning with 200+ resources for web developers...It's a no brainer!</h4>
					<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for resources..." title="Type in a name">
				</article>
				<ul id="myUL">
				<article>
					<h2><a href="https://www.w3schools.com/default.asp" target="_blank">W3Schools</a></h2>
					<p>Learn to Code with the World's Largest Developer Site. Tutorials, References, Exercises, Examples, Quizzes, Courses, Certificates. Learn: HTML, CSS, JavaScript, SQL, PHP, Python, jQuery, C++, C#, Bootstrap, Git...</p>
				</article>
				<article>
					<h2><a href="https://developer.mozilla.org/en-US/" target="_blank">MDN WebDocs</a></h2>
					<p>Resources for Developers, by Developers. References, Guides, Turtorials. Learn: Web Development, Gaming Development, Developer Tools, Web Technologies: HTML, CSS, JavaScript, Graphics, APIs, Browser Extensions...</p>
				</article>
				<article>
					<h2><a href="https://stackoverflow.com/" target="_blank">StackOverflow</a></h2>
					<p>A community-based space to find and contribue answers to technical challenges and one of the most popular wesbites in the world. Join the community! Services: Ask Questions, Answers, Reference, Jobs, Companies, Collectives, Collaborate, Share...</p>
				</article>
				<article>
					<h2><a href="https://stackexchange.com/" target="_blank">StackExchange</a></h2>
					<p>The Stack Exchange network comprises 173 Q&A communities including Stack Overflow, the largest, most trusted online community for developers to learn, share their knowledge, and build their careers, Ask questions, get answers, no distractions. Find community digests, top users, Q&A sites...</p>
				</article>
				<article>
					<h2><a href="https://github.com/" target="_blank">GitHub</a></h2>
					<p>Where the world builds software. The largest and most advanced development platform in the world! Services: Web hosting, cloud platform, codespaces, repositories, open source, integrations...</p>
				</article>
				<article>
					<h2><a href="https://codepen.io/" target="_blank">CodePen</a></h2>
					<p>The best place to build, test, and discover front-end code. CodePen is a social development environment for front-end designers and developers. Build and deploy a website, show off your work, build test cases to learn and debug, and find inspiration.</p>
				</article>
				<article>
					<h2><a href="https://about.gitlab.com/" target="_blank">GitLab</a></h2>
					<p>GitLab's DevOps platform is a single application for unparalleled collaboration, visibility, and development velocity. Learn more here! Free unlimited (private) repositories and unlimited collaborators. Explore projects on GitLab.com (no login needed); Click the link for more information ...</p>
				</article>
				<article>
					<h2><a href="https://git-scm.com/" target="_blank">Git-Fast-Version-Control </a></h2>
					<p>Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git branching and merging, free and open source, data assurance, pro git book... </p>
				</article>
				<article>
					<h2><a href="https://www.npmjs.com/" target="_blank">NPM</a></h2>
					<p>The NPM registry is a public collection of packages of open-source code for Node.js, front-end web apps, mobile apps, robots, routers, and countless other needs of the JavaScript community. NPM is the command-line-client that allows developers to install and publish those packages.</p>
				</article>
				<article>
					<h2><a href="https://yarnpkg.com/" target="_blank">Yarn</a></h2>
					<p>Yarn is a package manager that doubles down as project manager. Whether you work on one-shot projects or large monorepos, as a hobbyist or an enterprise user, we've got you covered. Yarn does this quickly, securely, and reliably so you don't ever have to worry.</p>
				</article>
				<article>
					<h2><a href="https://brew.sh/" target="_blank">Homebrew</a></h2>
					<p>The Missing Package Manager for macOS (or Linux. Homebrew installs the stuff you need that Apple (or your Linux system) didn’t.Homebrew is the easiest and most flexible way to install the UNIX tools Apple didn’t include with macOS</p>
				</article>
				<article>
					<h2><a href="https://cdnjs.com/" target="_blank">CDNJS</a></h2>
					<p>CDNJS is a free and open-source CDN service trusted by over 12.5% of all websites, serving over 200 billion requests each month, powered by Cloudflare. We make it faster and easier to load library files on your websites. Search from 4,141 libraries on CDNJS.</p>
				</article>
				<article>
					<h2><a href="https://openbase.com/" target="_blank">OpenBase</a></h2>
					<p>Compare open-source packages with powerful metrics and user reviews. Over 500+ Package Categories. Discover the top-rated packages. Evaluate using metrics and reviews. Choose the right package.</p>
				</article>
				<article>
					<h2><a href="https://devdocs.io/" target="_blank">DevDocs</a></h2>
					<p>DevDocs combines multiple API documentations in a fast, organized, and searchable interface. DevDocs is free and open source. It was created by Thibaut Courouble and is operated by freeCodeCamp.</p>
				</article>
				<article>
					<h2><a href="https://overapi.com/" target="_blank">OverAPI</a></h2>
					<p>Collecting All Cheatsheets. A-Z list of helpful resources. This is the whole code of OverAPI, you can fork it and use it like Github Pages locally.</p>
				</article>
				<article>
					<h2><a href="https://devhints.io/" target="_blank">Devhints</a></h2>
					<p>A modest collection of cheatsheets for a variety of coding languages, libraries and applications.</p>
				</article>
				<article>
					<h2><a href="https://www.heroku.com/" target="_blank">Heroku</a></h2>
					<p>Heroku is a cloud-based, fully-managed platform as a service (Paas) for building, running, and managing apps. Developers, teams, and businesses of all sizes use Heroku to deploy, manage, and scale apps.</p>
				</article>
			</ul>
			</main>	
			<footer>
				<p>2022&copy;DevDum! Code Smarter. Not Harder.<a rel="nofollow" href="https://github.com/rdevans87/DevDum" target="_blank" rel="nofollow">Hosted on GitHub!</a></p>
				<a href="https://www.buymeacoffee.com/ryanevans" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 42px !important;width: 180px !important;"></a>
				<a href="https://www.producthunt.com/posts/devdum-code-smarter-not-harder?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-devdum&#0045;code&#0045;smarter&#0045;not&#0045;harder" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=343032&theme=light" 
					alt="DevDum&#0033;&#0032;Code&#0032;Smarter&#0046;&#0032;Not&#0032;Harder&#0046; - 200&#0043;&#0032;Resources&#0032;for&#0032;web&#0032;developers&#0046;&#0032;It&#0039;s&#0032;a&#0032;no&#0032;brainer&#0033; | Product Hunt" style="width: 200px; height: 43px;" width="250" height="54" /></a>
			</footer>
		</section>
	</div>
</div>
<script>
	function myFunction() {
		var input, filter, ul, li, a, i, txtValue;
		input = document.getElementById("myInput");
		filter = input.value.toUpperCase();
		ul = document.getElementById("myUL");
		article = ul.getElementsByTagName("article");
		for (i = 0; i < article.length; i++) {
			a = article[i].getElementsByTagName("a")[0];
			txtValue = a.textContent || a.innerText;
			if (txtValue.toUpperCase().indexOf(filter) > -1) {
			  article[i].style.display = "";
			} else {
				article[i].style.display = "none";
			}
		}
	}

	</script>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script> 
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" 
	integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>