Welcome to our blog post on 7 fun and challenging coding projects for beginners! Whether you’re a student looking to expand your skills or just someone who wants to try their hand at coding, these projects are designed to help you learn new techniques and build practical applications that you can use in real-world situations.
Each project is designed to be accessible to beginners, but also offers plenty of opportunities for more experienced coders to experiment and explore. From building a basic website to developing a chatbot with machine learning techniques, these projects will help you build a strong foundation in coding and set you up for success in your future endeavors.
So, without further ado, let’s dive in and explore these 7 exciting projects!
Project 1: Build a Basic Website with HTML and CSS
When it comes to web development, HTML and CSS are the building blocks for any website. Project 1 challenges you to create a basic website using these two languages. The goal is to gain an understanding of how HTML and CSS work together to create a fully functional and visually appealing website.
To get started, you will need to have a basic understanding of HTML and CSS syntax. HTML provides the structure of your website, while CSS is used to style and layout the content. You can use a text editor such as Sublime Text or Notepad++ to write your code.
The first step is to create an HTML file and add the required tags for the basic structure of the website. This includes the tag for adding metadata, the tag for adding content, and the
tag for naming your webpage.</p>
<p>Once the structure is in place, you can begin adding content to your website and styling it with CSS. This includes adding text, images, links, and other elements to your webpage. You can use CSS to change the font, color, size, and positioning of these elements.</p>
<p>One important thing to keep in mind when building a website is responsiveness. A responsive design ensures that your website looks good on all devices, including desktops, laptops, tablets, and smartphones. This can be achieved by using CSS media queries to adjust the layout and styling based on the screen size.</p>
<p>Overall, Project 1 is a great way to get started with web development and gain a solid foundation in HTML and CSS. With these skills, you can build a variety of websites, from simple static pages to complex dynamic web applications. So don’t be afraid to experiment, try new things, and have fun with your website!</p>
<blockquote><p>The first step is to create an HTML file and add the required tags for the basic structure of the website.</p></blockquote>
<h2>Project 2: Create a Simple Game with JavaScript</h2>
<p><img decoding="async" src="https://images.unsplash.com/photo-1660054373740-b8fc241e35f4?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHwzfHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" data-lazy-src="https://images.unsplash.com/photo-1660054373740-b8fc241e35f4?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHwzfHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080&is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class=" jetpack-lazy-image"><noscript><img data-lazy-fallback="1" decoding="async" src="https://images.unsplash.com/photo-1660054373740-b8fc241e35f4?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHwzfHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" /></noscript></p>
<p>JavaScript is a popular programming language for creating interactive and dynamic web pages. With its powerful capabilities, it can also be used to create games that users can play on their browsers. This project will challenge you to use your JavaScript skills to create a simple game.</p>
<p>The first step in creating a game with JavaScript is to decide on the game concept. You can choose a classic game like Snake or Tetris, or you can invent your own game. Once you have a game concept, you can start building it using JavaScript.</p>
<p>The game will require HTML and CSS to create the game board and add some visual effects. You can use HTML to create the structure of the game board, and CSS to add colors, images, and animations. JavaScript will be used to add interactivity to the game.</p>
<p>To create a game with JavaScript, you will need to use functions, loops, and conditional statements. You will also need to use event listeners to detect when the user interacts with the game board. JavaScript can be used to manipulate the game board, update scores, and handle game logic.</p>
<p>As you work on this project, you will need to be adaptable and creative. You may encounter bugs or challenges that require you to think outside the box. This is an opportunity to learn new skills and techniques.</p>
<p>Creating a game with JavaScript can be a fun and rewarding experience. It allows you to apply your programming skills in a creative way and build something that users can enjoy. Don’t be afraid to experiment and try new things. With practice, you can become a skilled game developer with JavaScript.</p>
<p>In the next section, we will explore how to develop a mobile app with React Native. Stay tuned!</p>
<blockquote><p>With its powerful capabilities, it can also be used to create games that users can play on their browsers.</p></blockquote>
<h2>Project 3: Develop a Mobile App with React Native</h2>
<p><img decoding="async" src="https://images.unsplash.com/photo-1453928582365-b6ad33cbcf64?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw0fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" data-lazy-src="https://images.unsplash.com/photo-1453928582365-b6ad33cbcf64?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw0fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080&is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class=" jetpack-lazy-image"><noscript><img data-lazy-fallback="1" decoding="async" src="https://images.unsplash.com/photo-1453928582365-b6ad33cbcf64?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw0fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" /></noscript></p>
<div>
<p>Mobile apps are an essential part of our lives today. Smartphones and tablets have become ubiquitous, and people use them for everything from communication to entertainment and work. To be a proficient programmer, you must know how to create mobile apps. That’s why Project 3 is all about developing a mobile app with React Native.</p>
<p>React Native is a popular JavaScript framework that enables you to build mobile apps for both iOS and Android platforms. It is based on the React library, which is widely used for developing web applications. With React Native, you can use the same codebase to create apps for both platforms, which saves a lot of time and effort.</p>
<p>The goal of this project is to teach you how to create a mobile app from scratch using React Native. You will learn how to set up your development environment, create a basic user interface, and implement the app’s functionality. Along the way, you will also learn about various components, tools, and APIs that React Native provides.</p>
<p>One of the best things about React Native is that it allows you to use your existing knowledge of JavaScript and React to create mobile apps. If you are already familiar with these technologies, you will find it easy to learn React Native. Even if you are new to JavaScript and React, you can still learn React Native with some effort and dedication.</p>
<p>Mobile app development is an exciting field that offers a lot of opportunities. Whether you want to create your own app or work for a company that develops apps, learning React Native is a valuable skill that can open many doors for you. So, take on Project 3 with enthusiasm and a willingness to learn, and you will be on your way to becoming a proficient mobile app developer.</p>
</div>
<blockquote><p>To be a proficient programmer, you must know how to create mobile apps.</p></blockquote>
<h2>Project 4: Build a data visualization tool with D3.js</h2>
<p><img decoding="async" src="https://images.unsplash.com/photo-1498050108023-c5249f4df085?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw1fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" data-lazy-src="https://images.unsplash.com/photo-1498050108023-c5249f4df085?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw1fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080&is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class=" jetpack-lazy-image"><noscript><img data-lazy-fallback="1" decoding="async" src="https://images.unsplash.com/photo-1498050108023-c5249f4df085?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=Mnw0MzA5MTd8MHwxfHNlYXJjaHw1fHxjb2RpbmclMjBsYXB0b3B8ZW58MHwwfHx8MTY4MzQ3NTI1MA&ixlib=rb-4.0.3&q=80&w=1080" alt="Unsplash image for coding laptop" /></noscript></p>
<p>When it comes to presenting data, aesthetics and functionality are essential. Building a data visualization tool with D3.js can help you achieve both of these goals, and more. This project is perfect for those who want to take their data analysis and presentation skills to the next level.</p>
<p>D3.js is a JavaScript library that allows you to create dynamic and interactive data visualizations on the web. It is widely used by data scientists and analysts to create stunning visuals that make complex data easy to understand. With D3.js, you can create various types of charts, such as bar charts, line charts, scatter plots, and more.</p>
<p>To get started with this project, you will need to have a good understanding of HTML, CSS, and JavaScript. You will also need to have some knowledge of data structures and algorithms. If you are not familiar with these concepts, don’t worry! There are plenty of online resources available that can help you get up to speed.</p>
<p>Once you have gained a good understanding of the basics, you can start building your data visualization tool with D3.js. The first step is to choose the type of chart that you want to create. This will depend on the type of data you have and the message you want to convey. Once you have chosen the chart type, you can start coding.</p>
<p>D3.js provides a set of functions that you can use to create your chart. These functions allow you to manipulate the data, create axes, and draw the chart elements. You can also add interactive features, such as tooltips and zooming, to make your chart more engaging.</p>
<p>One of the great things about D3.js is that it is highly customizable. You can tweak every aspect of your chart to ensure that it looks and functions exactly the way you want it to. This level of customization can be both challenging and rewarding, as it allows you to create truly unique and impressive data visualizations.</p>
<p>Building a data visualization tool with D3.js is a challenging and rewarding project that can help you take your data analysis and presentation skills to the next level. With D3.js, you can create stunning visuals that make complex data easy to understand. So, if you are up for a challenge and want to create something truly impressive, give this project a try!</p>
<blockquote><p>js is a JavaScript library that allows you to create dynamic and interactive data visualizations on the web.</p></blockquote>
<h2>Project 5: Use Python to Create a Web Scraper</h2>
<p><img decoding="async" src="https://i0.wp.com/images.unsplash.com/1/work-station-straight-on-view.jpg?w=640&ssl=1" alt="Unsplash image for coding laptop" data-recalc-dims="1" data-lazy-src="https://i0.wp.com/images.unsplash.com/1/work-station-straight-on-view.jpg?w=640&is-pending-load=1#038;ssl=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class=" jetpack-lazy-image"><noscript><img data-lazy-fallback="1" decoding="async" src="https://i0.wp.com/images.unsplash.com/1/work-station-straight-on-view.jpg?w=640&ssl=1" alt="Unsplash image for coding laptop" data-recalc-dims="1" /></noscript></p>
<p>If you’re looking to enhance your data mining or web scraping skills, Project 5 is the perfect opportunity. Web scraping is a technique used to extract data from websites automatically. Python is a powerful language for web scraping and data mining, making it an ideal choice for this project.</p>
<p>In this project, you will learn how to extract information from multiple web pages at once effortlessly. You will gain essential knowledge of Python web scraping libraries such as BeautifulSoup and Scrapy and how to use them to automate data mining. You will also learn how to clean and store scraped data in various formats such as CSV, JSON, and SQLite.</p>
<p>Python’s extensive libraries make web scraping much more manageable than in other languages. BeautifulSoup is a Python library that enables you to parse HTML and XML files, making it easier to extract data from different web pages. You can use Scrapy, another Python library, for web crawling and data extraction from dynamic websites.</p>
<p>With this project, you’ll be able to extract data from various websites and automate data mining tasks, making it much easier to gather data for research or analysis. You can also use the scraped data to train machine learning models that can make predictions or recommendations.</p>
<p>The project will also help you learn about ethical web scraping practices. You’ll learn about the legal and ethical considerations of web scraping, such as respecting the website’s terms of use and not harming the web server.</p>
<p>Python’s versatility and power make it an ideal language for web scraping and data mining. With this project, you’ll gain valuable experience working with web scraping libraries and automate tedious data collection tasks. You’ll also be able to apply your newfound skills to future projects, making you a more valuable developer.</p>
<p>Project 5 is an excellent opportunity to enhance your skills in web scraping and data mining with Python. You’ll learn how to automate data collection from various websites and clean and store the scraped data in different formats. The project will also help you gain knowledge of ethical web scraping practices and how to avoid legal issues. So, get ready to dive into the world of web scraping with Python, and don’t hesitate to experiment and adapt the techniques you learn to suit your needs.</p>
<h2>Project 6: Develop a Chatbot with Machine Learning Techniques</h2>
<p>Now, this is where things start to get really exciting! With Project 6, you’ll be delving into the realm of machine learning, a field that’s been growing rapidly over the past few years. By using machine learning techniques, you’ll be able to create a chatbot that can learn from user input and improve its responses over time.</p>
<p>Firstly, you’ll need to choose a platform to build your chatbot on. There are a variety of options available, including Dialogflow, IBM Watson, and Microsoft Bot Framework. Each platform has its own strengths and weaknesses, so take some time to research and choose the one that best fits your needs.</p>
<p>Once you’ve selected your platform, you’ll need to start building out the chatbot itself. This involves creating a set of intents, which are essentially the different types of questions or requests that users might make. For example, if you were building a chatbot for a pizza restaurant, you might create intents for ordering a pizza, checking the status of an order, or asking for the restaurant’s hours.</p>
<p>Next, you’ll need to train your chatbot using machine learning techniques. This involves feeding it a large amount of sample data and allowing the machine learning algorithms to analyze it and learn from it. The more data you provide, the better your chatbot will be at understanding and responding to user input.</p>
<p>Finally, you’ll want to test your chatbot thoroughly to ensure that it’s working as expected. This involves testing a variety of different scenarios and inputs to make sure that your chatbot is responding appropriately.</p>
<p>Overall, developing a chatbot with machine learning techniques is a challenging but incredibly rewarding project. It requires a strong understanding of both programming and machine learning concepts, but the end result can be a powerful tool for businesses and organizations looking to improve their customer service and engagement. So, don’t be afraid to dive in and start building your own chatbot today!</p>
<div class="wpulike wpulike-default " ><div class="wp_ulike_general_class wp_ulike_is_not_liked"><button type="button"
aria-label="Like Button"
data-ulike-id="8259"
data-ulike-nonce="26501ec13e"
data-ulike-type="post"
data-ulike-template="wpulike-default"
data-ulike-display-likers=""
data-ulike-likers-style="popover"
class="wp_ulike_btn wp_ulike_put_image wp_post_btn_8259"></button><span class="count-box wp_ulike_counter_up" data-ulike-counter-value="0"></span> </div></div>
<div class="post-share">
<div class="post-share-icons cf">
<a class="facebook" href="https://www.facebook.com/sharer.php?u=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/" class="link " target="_blank" >
<i class="fab fa-facebook"></i></a>
<a class="twitter" href="http://twitter.com/share?url=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/&text=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills" class="link " target="_blank">
<i class="fab fa-twitter"></i></a>
<a class="envelope" href="mailto:?subject=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills&body=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/" class="link " target="_blank" >
<i class="fas fa-envelope-open"></i></a>
<a class="linkedin" href="https://www.linkedin.com/sharing/share-offsite/?url=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/&title=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills" class="link " target="_blank" >
<i class="fab fa-linkedin"></i></a>
<a href="javascript:pinIt();" class="pinterest"><i class="fab fa-pinterest"></i></a>
<a class="telegram" href="https://t.me/share/url?url=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/&title=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills" target="_blank" >
<i class="fab fa-telegram"></i>
</a>
<a class="whatsapp" href="https://api.whatsapp.com/send?text&url=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/&title=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills" target="_blank" >
<i class="fab fa-whatsapp"></i>
</a>
<a class="reddit" href="https://www.reddit.com/submit?url=https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/&title=10%20Creative%20Coding%20Projects%20to%20Help%20You%20Build%20Your%20Skills" target="_blank" >
<i class="fab fa-reddit"></i>
</a>
</div>
</div>
<div class="clearfix mb-3"></div>
<nav class="navigation post-navigation" aria-label="Posts">
<h2 class="screen-reader-text">Post navigation</h2>
<div class="nav-links"><div class="nav-previous"><a href="https://harmonyhustle.com/2023/05/07/how-to-build-a-custom-chatbot-using-python/" rel="prev"><div class="fa fa-angle-double-left"></div><span></span> How to Build a Custom Chatbot using Python </a></div><div class="nav-next"><a href="https://harmonyhustle.com/2023/05/07/10-coding-projects-to-help-you-learn-python/" rel="next"> 10 Coding Projects to Help You Learn Python <div class="fa fa-angle-double-right"></div><span></span></a></div></div>
</nav> </article>
</div>
<div class="bs-info-author-block py-4 px-3 mb-4 flex-column justify-content-center text-center">
<a class="bs-author-pic mb-3" href="https://harmonyhustle.com/author/thomas/"><img alt="Avatar photo" src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg" class="avatar avatar-150 photo jetpack-lazy-image" height="150" width="150" decoding="async" data-lazy-srcset="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x" data-lazy-src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg?is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"><noscript><img data-lazy-fallback="1" alt='Avatar photo' src='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg' srcset='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x' class='avatar avatar-150 photo' height='150' width='150' loading='lazy' decoding='async' /></noscript></a>
<div class="flex-grow-1">
<h4 class="title">By <a href ="https://harmonyhustle.com/author/thomas/">Tom</a></h4>
<p></p>
</div>
</div>
<div class="py-4 px-3 mb-4 bs-card-box">
<!--Start bs-realated-slider -->
<div class="bs-widget-title mb-3">
<!-- bs-sec-title -->
<h4 class="title">Related Post</h4>
</div>
<!-- // bs-sec-title -->
<div class="related-post">
<div class="row">
<!-- featured_post -->
<!-- blog -->
<div class="col-md-4">
<div class="bs-blog-post three md back-img bshre mb-md-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713384048.jpg?fit=1024%2C768&ssl=1');" >
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/5-fun-coding-projects-for-beginners-13/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/coding/" alt="View all posts in Coding">
Coding
</a>
</div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/5-fun-coding-projects-for-beginners-13/" title="Permalink to: 5 Fun Coding Projects for Beginners">
5 Fun Coding Projects for Beginners</a> </h4>
<div class="bs-blog-meta">
<span class="bs-author"> <a class="auth" href="https://harmonyhustle.com/author/thomas/"> <img alt="Avatar photo" src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg" class="avatar avatar-150 photo jetpack-lazy-image" height="150" width="150" decoding="async" data-lazy-srcset="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x" data-lazy-src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg?is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"><noscript><img data-lazy-fallback="1" alt='Avatar photo' src='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg' srcset='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x' class='avatar avatar-150 photo' height='150' width='150' loading='lazy' decoding='async' /></noscript>Tom </a>
</span>
<span class="bs-blog-date"> <a href="https://harmonyhustle.com/2024/04/"> Apr 17, 2024</a></span>
</div>
</div>
</div>
</div>
<!-- blog -->
<!-- blog -->
<div class="col-md-4">
<div class="bs-blog-post three md back-img bshre mb-md-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713376849.jpg?fit=1024%2C706&ssl=1');" >
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/the-art-of-debugging-tips-and-tricks-for-solving-coding-errors-2/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/coding/" alt="View all posts in Coding">
Coding
</a>
</div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/the-art-of-debugging-tips-and-tricks-for-solving-coding-errors-2/" title="Permalink to: The Art of Debugging: Tips and Tricks for Solving Coding Errors">
The Art of Debugging: Tips and Tricks for Solving Coding Errors</a> </h4>
<div class="bs-blog-meta">
<span class="bs-author"> <a class="auth" href="https://harmonyhustle.com/author/thomas/"> <img alt="Avatar photo" src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg" class="avatar avatar-150 photo jetpack-lazy-image" height="150" width="150" decoding="async" data-lazy-srcset="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x" data-lazy-src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg?is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"><noscript><img data-lazy-fallback="1" alt='Avatar photo' src='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg' srcset='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x' class='avatar avatar-150 photo' height='150' width='150' loading='lazy' decoding='async' /></noscript>Tom </a>
</span>
<span class="bs-blog-date"> <a href="https://harmonyhustle.com/2024/04/"> Apr 17, 2024</a></span>
</div>
</div>
</div>
</div>
<!-- blog -->
<!-- blog -->
<div class="col-md-4">
<div class="bs-blog-post three md back-img bshre mb-md-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713369648.jpg?fit=1024%2C683&ssl=1');" >
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/top-10-coding-challenges-to-sharpen-your-skills/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/coding/" alt="View all posts in Coding">
Coding
</a>
</div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/top-10-coding-challenges-to-sharpen-your-skills/" title="Permalink to: Top 10 Coding Challenges to Sharpen Your Skills">
Top 10 Coding Challenges to Sharpen Your Skills</a> </h4>
<div class="bs-blog-meta">
<span class="bs-author"> <a class="auth" href="https://harmonyhustle.com/author/thomas/"> <img alt="Avatar photo" src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg" class="avatar avatar-150 photo jetpack-lazy-image" height="150" width="150" decoding="async" data-lazy-srcset="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x" data-lazy-src="https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg?is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"><noscript><img data-lazy-fallback="1" alt='Avatar photo' src='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-150x150.jpg' srcset='https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-300x300.jpg 2x' class='avatar avatar-150 photo' height='150' width='150' loading='lazy' decoding='async' /></noscript>Tom </a>
</span>
<span class="bs-blog-date"> <a href="https://harmonyhustle.com/2024/04/"> Apr 17, 2024</a></span>
</div>
</div>
</div>
</div>
<!-- blog -->
</div>
</div>
</div>
<!--End bs-realated-slider -->
</div>
<!--sidebar-->
<!--col-lg-3-->
<aside class="col-lg-3">
<div id="sidebar-right" class="bs-sidebar bs-sticky ">
<div id="block-2" class="bs-widget widget_block widget_search"><form role="search" method="get" action="https://harmonyhustle.com/" class="wp-block-search__button-outside wp-block-search__text-button wp-block-search"><label for="wp-block-search__input-1" class="wp-block-search__label" >Search</label><div class="wp-block-search__inside-wrapper " ><input type="search" id="wp-block-search__input-1" class="wp-block-search__input" name="s" value="" placeholder="" required /><button type="submit" class="wp-block-search__button wp-element-button" >Search</button></div></form></div><div id="block-3" class="bs-widget widget_block"><div class="wp-block-group is-layout-flow"><div class="wp-block-group__inner-container"><h2 class="wp-block-heading">Recent Posts</h2><ul class="wp-block-latest-posts__list wp-block-latest-posts"><li><a class="wp-block-latest-posts__post-title" href="https://harmonyhustle.com/2024/04/17/the-rise-of-crypto-art-exploring-the-intersection-of-nfts-and-digital-creativity/">The Rise of Crypto Art: Exploring the Intersection of NFTs and Digital Creativity</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://harmonyhustle.com/2024/04/17/boost-your-energy-the-benefits-of-a-morning-yoga-routine/">Boost Your Energy: The Benefits of a Morning Yoga Routine</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://harmonyhustle.com/2024/04/17/5-tips-for-building-a-strong-financial-foundation-30/">5 Tips for Building a Strong Financial Foundation</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://harmonyhustle.com/2024/04/17/10-creative-workspace-ideas-for-remote-workers-5/">10 Creative Workspace Ideas for Remote Workers</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://harmonyhustle.com/2024/04/17/5-fun-coding-projects-for-beginners-13/">5 Fun Coding Projects for Beginners</a></li>
</ul></div></div></div><div id="block-4" class="bs-widget widget_block"><div class="wp-block-group is-layout-flow"><div class="wp-block-group__inner-container"><h2 class="wp-block-heading">Recent Comments</h2><div class="no-comments wp-block-latest-comments">No comments to show.</div></div></div></div><div id="block-5" class="bs-widget widget_block"><div class="wp-block-group is-layout-flow"><div class="wp-block-group__inner-container"><h2 class="wp-block-heading">Archives</h2><ul class="wp-block-archives-list wp-block-archives"> <li><a href='https://harmonyhustle.com/2024/04/'>April 2024</a></li>
<li><a href='https://harmonyhustle.com/2024/03/'>March 2024</a></li>
<li><a href='https://harmonyhustle.com/2024/02/'>February 2024</a></li>
<li><a href='https://harmonyhustle.com/2024/01/'>January 2024</a></li>
<li><a href='https://harmonyhustle.com/2023/12/'>December 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/11/'>November 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/10/'>October 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/09/'>September 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/08/'>August 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/07/'>July 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/06/'>June 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/05/'>May 2023</a></li>
<li><a href='https://harmonyhustle.com/2023/04/'>April 2023</a></li>
</ul></div></div></div><div id="block-6" class="bs-widget widget_block"><div class="wp-block-group is-layout-flow"><div class="wp-block-group__inner-container"><h2 class="wp-block-heading">Categories</h2><ul class="wp-block-categories-list wp-block-categories"> <li class="cat-item cat-item-10"><a href="https://harmonyhustle.com/category/artificial-intelligence/">Artificial Intelligence</a>
</li>
<li class="cat-item cat-item-6"><a href="https://harmonyhustle.com/category/balanced-living/">Balanced Living</a>
</li>
<li class="cat-item cat-item-4"><a href="https://harmonyhustle.com/category/career-development/">Career Development</a>
</li>
<li class="cat-item cat-item-12"><a href="https://harmonyhustle.com/category/coding/">Coding</a>
</li>
<li class="cat-item cat-item-11"><a href="https://harmonyhustle.com/category/crypto/">Crypto</a>
</li>
<li class="cat-item cat-item-5"><a href="https://harmonyhustle.com/category/financial-wellness/">Financial Wellness</a>
</li>
<li class="cat-item cat-item-9"><a href="https://harmonyhustle.com/category/hustle-hq/">Hustle HQ</a>
</li>
<li class="cat-item cat-item-7"><a href="https://harmonyhustle.com/category/personal-growth/">Personal Growth</a>
</li>
<li class="cat-item cat-item-8"><a href="https://harmonyhustle.com/category/productivity/">Productivity</a>
</li>
<li class="cat-item cat-item-13"><a href="https://harmonyhustle.com/category/startups/">Startups</a>
</li>
</ul></div></div></div> </div> </aside>
<!--/col-lg-3-->
<!--/sidebar-->
</div>
<!--/row-->
</div>
<!--/container-->
</main>
<!--==================== Missed ====================-->
<div class="missed">
<div class="container">
<div class="row">
<div class="col-12">
<div class="wd-back">
<div class="bs-widget-title">
<h2 class="title">You Missed</h2>
</div>
<div class="row">
<div class="col-md-6 col-lg-3">
<div class="bs-blog-post three md back-img bshre mb-lg-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713387638.jpg?fit=1024%2C768&ssl=1'); ">
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/the-rise-of-crypto-art-exploring-the-intersection-of-nfts-and-digital-creativity/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/crypto/" alt="View all posts in Crypto">
Crypto
</a> </div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/the-rise-of-crypto-art-exploring-the-intersection-of-nfts-and-digital-creativity/" title="Permalink to: The Rise of Crypto Art: Exploring the Intersection of NFTs and Digital Creativity"> The Rise of Crypto Art: Exploring the Intersection of NFTs and Digital Creativity</a> </h4>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="bs-blog-post three md back-img bshre mb-lg-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713387619.jpg?fit=1024%2C683&ssl=1'); ">
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/boost-your-energy-the-benefits-of-a-morning-yoga-routine/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/balanced-living/" alt="View all posts in Balanced Living">
Balanced Living
</a> </div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/boost-your-energy-the-benefits-of-a-morning-yoga-routine/" title="Permalink to: Boost Your Energy: The Benefits of a Morning Yoga Routine"> Boost Your Energy: The Benefits of a Morning Yoga Routine</a> </h4>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="bs-blog-post three md back-img bshre mb-lg-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713387617.jpg?fit=1024%2C683&ssl=1'); ">
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/5-tips-for-building-a-strong-financial-foundation-30/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/financial-wellness/" alt="View all posts in Financial Wellness">
Financial Wellness
</a> </div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/5-tips-for-building-a-strong-financial-foundation-30/" title="Permalink to: 5 Tips for Building a Strong Financial Foundation"> 5 Tips for Building a Strong Financial Foundation</a> </h4>
</div>
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="bs-blog-post three md back-img bshre mb-lg-0" style="background-image: url('https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2024/04/1713387613.jpg?fit=1024%2C683&ssl=1'); ">
<a class="link-div" href="https://harmonyhustle.com/2024/04/17/10-creative-workspace-ideas-for-remote-workers-5/"></a>
<div class="inner">
<div class="bs-blog-category">
<a class="blogus-categories category-color-1" href="https://harmonyhustle.com/category/hustle-hq/" alt="View all posts in Hustle HQ">
Hustle HQ
</a> </div>
<h4 class="title sm mb-0"> <a href="https://harmonyhustle.com/2024/04/17/10-creative-workspace-ideas-for-remote-workers-5/" title="Permalink to: 10 Creative Workspace Ideas for Remote Workers"> 10 Creative Workspace Ideas for Remote Workers</a> </h4>
</div>
</div>
</div>
</div><!-- end inner row -->
</div><!-- end wd-back -->
</div><!-- end col12 -->
</div><!-- end row -->
</div><!-- end container -->
</div>
<!-- end missed -->
<!--==================== FOOTER AREA ====================-->
<footer>
<div class="overlay" style="background-color: ;">
<!--Start bs-footer-widget-area-->
<div class="bs-footer-bottom-area">
<div class="container">
<div class="divide-line"></div>
<div class="row align-items-center">
<div class="col-md-6">
<div class="footer-logo">
<div class="site-branding-text">
<p class="site-title-footer"> <a href="https://harmonyhustle.com/" rel="home">Harmony Hustle</a></p>
<p class="site-description-footer">Find your balance, make your mark</p>
</div>
</div>
</div>
<!--col-md-3-->
<div class="col-md-6">
<ul class="bs-social justify-content-center justify-content-md-end">
<li><a href="#"><i class="fab fa-facebook"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
<li><a href="#"><i class="fab fa-youtube"></i></a></li>
<li><a href="#"><i class="fab fa-telegram"></i></a></li>
</ul>
</div>
<!--/col-md-3-->
</div>
<!--/row-->
</div>
<!--/container-->
</div>
<!--End bs-footer-widget-area-->
</div>
<!--/overlay-->
</footer>
<!--/footer-->
</div>
<!--/wrapper-->
<!--Scroll To Top-->
<a href="#" class="bs_upscr bounceInup animated"><i class="fas fa-angle-double-up"></i></a>
<!--/Scroll To Top-->
<!-- Modal -->
<div class="modal fade bs_model" id="exampleModal" data-bs-keyboard="true" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"><i class="fa fa-times"></i></button>
</div>
<div class="modal-body">
<form role="search" method="get" class="search-form" action="https://harmonyhustle.com/">
<label>
<span class="screen-reader-text">Search for:</span>
<input type="search" class="search-field" placeholder="Search …" value="" name="s" />
</label>
<input type="submit" class="search-submit" value="Search" />
</form> </div>
</div>
</div>
</div>
<!-- /Modal -->
<!-- /Scroll To Top -->
<style>
footer .footer-logo img{
width: 210px;
height: 70px;
}
</style>
<style type="text/css">
/*==================== Top Bar color ====================*/
.bs-head-detail
{
background: ;
}
.bs-head-detail .top-date, .bs-head-detail
{
color: ;
}
/*==================== Menu color ====================*/
.navbar-wp
{
background: ;
}
.bs-default .navbar-wp .navbar-nav > li > a{
background: ;
color: ;
}
.bs-default .navbar-wp .navbar-nav > li > a:hover{
color: ;
}
.navbar-wp .dropdown-menu > li > a {
background: #fff;
color: ;
}
.navbar-wp .dropdown-menu > li > a:hover, .navbar-wp .dropdown-menu > li > a:focus {
background: ;
color: ;
}
.bs-default .navbar-collapse ul, .navbar-wp .dropdown-menu > li > a:hover, .navbar-wp .dropdown-menu > li > a:focus {
background: #d13035;
}
/*=================== Subscribe Button Color ===================*/
.desk-header .btn-subscribe{
background: ;
color: ;
border-color: ;
}
.desk-header .btn-subscribe:hover{
background: ;
color: ;
border-color: ;
}
/*=================== Breadeking News Color ===================*/
.bs-latest-news
{
background: ;
}
.bs-latest-news .bs-latest-news-slider a
{
color: ;
}
/*=================== Slider Color ===================*/
.homemain .bs-slide.overlay:before{
background-color: #00000099;
}
.bs-slide .inner .title a
{
color: ;
}
.bs-slide .inner .title{
font-size: 50px;
}
</style>
<style>
.site-branding-text p , .site-title a {
color: ;
}
</style>
<script type="application/ld+json" class="yoast-schema-graph">{"@context":"https://schema.org","@graph":[{"@type":"WebPage","@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/","url":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/","name":"10 Creative Coding Projects to Help You Build Your Skills - Harmony Hustle","isPartOf":{"@id":"https://harmonyhustle.com/#website"},"primaryImageOfPage":{"@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/#primaryimage"},"image":{"@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/#primaryimage"},"thumbnailUrl":"https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2023/05/1683475251.jpg?fit=1080%2C810&ssl=1","datePublished":"2023-05-07T16:03:56+00:00","dateModified":"2023-05-07T16:03:56+00:00","author":{"@id":"https://harmonyhustle.com/#/schema/person/c0489d3348c4de1d3c296310440812e7"},"breadcrumb":{"@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/#primaryimage","url":"https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2023/05/1683475251.jpg?fit=1080%2C810&ssl=1","contentUrl":"https://i0.wp.com/harmonyhustle.com/wp-content/uploads/2023/05/1683475251.jpg?fit=1080%2C810&ssl=1","width":1080,"height":810},{"@type":"BreadcrumbList","@id":"https://harmonyhustle.com/2023/05/07/10-creative-coding-projects-to-help-you-build-your-skills/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://harmonyhustle.com/"},{"@type":"ListItem","position":2,"name":"10 Creative Coding Projects to Help You Build Your Skills"}]},{"@type":"WebSite","@id":"https://harmonyhustle.com/#website","url":"https://harmonyhustle.com/","name":"Harmony Hustle","description":"Find your balance, make your mark","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://harmonyhustle.com/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https://harmonyhustle.com/#/schema/person/c0489d3348c4de1d3c296310440812e7","name":"Tom","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://harmonyhustle.com/#/schema/person/image/","url":"https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-96x96.jpg","contentUrl":"https://harmonyhustle.com/wp-content/uploads/2023/04/cropped-tom-96x96.jpg","caption":"Tom"},"url":"https://harmonyhustle.com/author/thomas/"}]}</script><script type="text/javascript">
window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/harmonyhustle.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=6.2.6"}};
/*! This file is auto-generated */
!function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){p.clearRect(0,0,i.width,i.height),p.fillText(e,0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(t,0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(p&&p.fillText)switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s("\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!s("\ud83c\uddfa\ud83c\uddf3","\ud83c\uddfa\u200b\ud83c\uddf3")&&!s("\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!s("\ud83e\udef1\ud83c\udffb\u200d\ud83e\udef2\ud83c\udfff","\ud83e\udef1\ud83c\udffb\u200b\ud83e\udef2\ud83c\udfff")}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(e=t.source||{}).concatemoji?c(e.concatemoji):e.wpemoji&&e.twemoji&&(c(e.twemoji),c(e.wpemoji)))}(window,document,window._wpemojiSettings);
</script><script type='text/javascript' src='https://harmonyhustle.com/wp-includes/js/jquery/jquery.min.js?ver=3.6.4' id='jquery-core-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.4.0' id='jquery-migrate-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/plugins/ansar-import/public/js/ansar-import-public.js?ver=1.0.5' id='ansar-import-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/navigation.js?ver=6.2.6' id='blogus-navigation-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/bootstrap.js?ver=6.2.6' id='blogus_bootstrap_script-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/swiper-bundle.js?ver=6.2.6' id='swiper-bundle-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/main.js?ver=6.2.6' id='blogus_main-js-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/sticksy.min.js?ver=6.2.6' id='sticksy-js-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/jquery.smartmenus.js?ver=6.2.6' id='smartmenus-js-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/jquery.smartmenus.bootstrap.js?ver=6.2.6' id='bootstrap-smartmenus-js-js'></script><script>
document.documentElement.classList.add(
'jetpack-lazy-images-js-enabled'
);
</script><script>
function pinIt()
{
var e = document.createElement('script');
e.setAttribute('type','text/javascript');
e.setAttribute('charset','UTF-8');
e.setAttribute('src','https://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);
document.body.appendChild(e);
}
</script><script type="text/javascript">
(function($) {
"use strict";
document.documentElement.setAttribute("data-theme", " ")
document.getElementById("switch").checked = false;
localStorage.setItem("data-theme", '')
})(jQuery);
</script><script type="text/javascript">
let theme = localStorage.getItem('data-theme');
const checkbox = document.getElementById("switch");
const changeThemeToDark = () =>{
document.documentElement.setAttribute("data-theme", "dark")
document.getElementById("switch").checked = true;
localStorage.setItem("data-theme", "dark")
console.log("I give you dark")
document.querySelector(".site-title a").style.color = '#fff';
document.querySelector(".site-description").style.color = '#fff';
// For Responsive
document.querySelector(".m-header .site-title a").style.color = '#fff';
document.querySelector(".m-header .site-description").style.color = '#fff';
}
const changeThemeToLight = () =>{
document.documentElement.setAttribute("data-theme", "")
localStorage.setItem("data-theme", '')
console.log("I give you light")
document.querySelector(".site-title a").style.color = '#000';
document.querySelector(".site-description").style.color = '#000';
// For Responsive
document.querySelector(".m-header .site-title a").style.color = '#000';
document.querySelector(".m-header .site-description").style.color = '#000';
}
if(theme === 'dark'){
changeThemeToDark()
}else{
changeThemeToLight()
}
checkbox.addEventListener('change', ()=> {
let theme = localStorage.getItem('data-theme');
if (theme ==='dark'){
changeThemeToLight()
}else{
changeThemeToDark()
}
});
</script><script type="text/javascript">
Sticksy.initializeAll('.bs-sticky', {topSpacing: 0}, { listen: true });
</script><script>window.addEventListener( 'load', function() {
document.querySelectorAll( 'link' ).forEach( function( e ) {'not all' === e.media && e.dataset.media && ( e.media = e.dataset.media, delete e.dataset.media );} );
var e = document.getElementById( 'jetpack-boost-critical-css' );
e && ( e.media = 'not all' );
} );</script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/plugins/jetpack-boost/jetpack_vendor/automattic/jetpack-image-cdn/src/js/photon.js?ver=20191001' id='jetpack-photon-js'></script><script type='text/javascript' id='wp_ulike-js-extra'>
/* <![CDATA[ */
var wp_ulike_params = {"ajax_url":"https:\/\/harmonyhustle.com\/wp-admin\/admin-ajax.php","notifications":"1"};
/* ]]> */
</script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/plugins/wp-ulike/assets/js/wp-ulike.min.js?ver=4.6.7' id='wp_ulike-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-includes/js/comment-reply.min.js?ver=6.2.6' id='comment-reply-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/plugins/jetpack/jetpack_vendor/automattic/jetpack-lazy-images/dist/intersection-observer.js?minify=false&ver=83ec8aa758f883d6da14' id='jetpack-lazy-images-polyfill-intersectionobserver-js'></script><script type='text/javascript' id='jetpack-lazy-images-js-extra'>
/* <![CDATA[ */
var jetpackLazyImagesL10n = {"loading_warning":"Images are still loading. Please cancel your print and try again."};
/* ]]> */
</script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/plugins/jetpack/jetpack_vendor/automattic/jetpack-lazy-images/dist/lazy-images.js?minify=false&ver=2e29137590434abf5fbe' id='jetpack-lazy-images-js'></script><script defer type='text/javascript' src='https://stats.wp.com/e-202447.js' id='jetpack-stats-js'></script><script type='text/javascript' id='jetpack-stats-js-after'>
_stq = window._stq || [];
_stq.push([ "view", {v:'ext',blog:'217438912',post:'8259',tz:'0',srv:'harmonyhustle.com',j:'1:12.1.2'} ]);
_stq.push([ "clickTrackerInit", "217438912", "8259" ]);
</script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/dark.js?ver=6.2.6' id='blogus-dark-js'></script><script type='text/javascript' src='https://harmonyhustle.com/wp-content/themes/blogus/js/custom.js?ver=6.2.6' id='blogus_custom-js-js'></script><script>
/(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",function(){var t,e=location.hash.substring(1);/^[A-z0-9_-]+$/.test(e)&&(t=document.getElementById(e))&&(/^(?:a|select|input|button|textarea)$/i.test(t.tagName)||(t.tabIndex=-1),t.focus())},!1);
</script></body>
</html>
