<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Renaissance Engineer</title>
    <description>The latest articles on DEV Community by Renaissance Engineer (@renaissanceengineer).</description>
    <link>https://dev.to/renaissanceengineer</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F194630%2F219dd9d5-c690-4996-a552-110518583eeb.JPG</url>
      <title>DEV Community: Renaissance Engineer</title>
      <link>https://dev.to/renaissanceengineer</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/renaissanceengineer"/>
    <language>en</language>
    <item>
      <title>Create a custom scrollbar with CSS - Easy CSS Scrollbar Tutorial</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Fri, 23 Apr 2021 17:06:06 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/create-a-custom-scrollbar-with-css-easy-css-scrollbar-tutorial-4ag2</link>
      <guid>https://dev.to/renaissanceengineer/create-a-custom-scrollbar-with-css-easy-css-scrollbar-tutorial-4ag2</guid>
      <description>&lt;p&gt;In this video tutorial you will learn how to use CSS to create a custom scrollbar for your website or app.&lt;/p&gt;

&lt;p&gt;I will be going over the basic CSS properties available and create the following scrollbar styles:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Dark Theme design&lt;/li&gt;
&lt;li&gt;Minimalist&lt;/li&gt;
&lt;li&gt;Patterned&lt;/li&gt;
&lt;li&gt;"Animated" Scrollbar effect&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/Gp6c9lJgPUI"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;link to github repo - &lt;a href="https://github.com/renaissanceengineer/css-scrollbar-tutorial"&gt;https://github.com/renaissanceengineer/css-scrollbar-tutorial&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>tutorial</category>
      <category>css</category>
      <category>beginners</category>
    </item>
    <item>
      <title>ReactJS Giphy API Tutorial</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Wed, 31 Mar 2021 03:14:56 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/reactjs-giphy-api-tutorial-4234</link>
      <guid>https://dev.to/renaissanceengineer/reactjs-giphy-api-tutorial-4234</guid>
      <description>&lt;p&gt;Giphy is a pretty fun app with a huge amount of content. Lot's of big companies like Slack integrate with Giphy to add some fun to their product, but you might not realize that the Giphy API is free to use for developers as well.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fio39kbv9vgn1mj6ej7p0.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fio39kbv9vgn1mj6ej7p0.jpg" alt="Giphy API demo"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this video I'll show you how to use one of their newer API features, automatically generating animated text with a bunch of interesting styles.&lt;/p&gt;

&lt;p&gt;There's also a bunch of other cool API endpoints available for you to use that I cover towards the end of the video like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Search by keyword&lt;/li&gt;
&lt;li&gt;Pre-Built React Components provided by Giphy&lt;/li&gt;
&lt;li&gt;Trending Gifs&lt;/li&gt;
&lt;li&gt;Random and Weirdness sorted Gifs&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/H8JpzxRoS18"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Link to Github Repo:&lt;br&gt;
&lt;a href="https://github.com/renaissancetroll/reactjs-gitphy-api-tutorial" rel="noopener noreferrer"&gt;https://github.com/renaissancetroll/reactjs-gitphy-api-tutorial&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>react</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>GTA V Loading Time Fix Explained- AKA Why Big O Matters</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Fri, 26 Mar 2021 01:29:11 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/gta-v-loading-time-fix-explained-aka-why-big-o-matters-417n</link>
      <guid>https://dev.to/renaissanceengineer/gta-v-loading-time-fix-explained-aka-why-big-o-matters-417n</guid>
      <description>&lt;p&gt;You may have heard in the news how a single programmer was able to reduce the loading time on GTA V online by 70%. In this video I explain how he did it and summarize what was wrong with GTA's code.&lt;/p&gt;

&lt;p&gt;I hate a lot of the Leetcode style coding interviews companies use like most software engineers, &lt;strong&gt;but this is a good example of why knowing even some basic data structures and algorithms is pretty important.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The bigger issue in this case is that nobody at Rockstar games took a few hours to fix this simple issue despite having 7 years to do it.&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/JYC3BqDBKRo"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;If you are interested in another practical example to get yourself motivated learn data structures and other CS fundamentals, you can check out my video showing how switching 1 line of code can speed up this example code by 30X in this article:&lt;/p&gt;


&lt;div class="ltag__link"&gt;
  &lt;a href="/renaissanceengineer" class="ltag__link__link"&gt;
    &lt;div class="ltag__link__pic"&gt;
      &lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F194630%2F219dd9d5-c690-4996-a552-110518583eeb.JPG" alt="renaissanceengineer"&gt;
    &lt;/div&gt;
  &lt;/a&gt;
  &lt;a href="/renaissanceengineer/real-world-data-structures-30x-faster-with-1-loc-2251" class="ltag__link__link"&gt;
    &lt;div class="ltag__link__content"&gt;
      &lt;h2&gt;Real World Data Structures - 30X Faster with 1 LOC&lt;/h2&gt;
      &lt;h3&gt;Renaissance Engineer ・ Sep 9 '20&lt;/h3&gt;
      &lt;div class="ltag__link__taglist"&gt;
        &lt;span class="ltag__link__tag"&gt;#career&lt;/span&gt;
        &lt;span class="ltag__link__tag"&gt;#beginners&lt;/span&gt;
        &lt;span class="ltag__link__tag"&gt;#webdev&lt;/span&gt;
        &lt;span class="ltag__link__tag"&gt;#computerscience&lt;/span&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/a&gt;
&lt;/div&gt;


&lt;p&gt;I generally follow the 80/20 rule, even a small amount of time spent learning these CS fundamentals can dramatically improve the performance of your code.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>tutorial</category>
      <category>javascript</category>
      <category>career</category>
    </item>
    <item>
      <title>Leetcoder talks about his job hunt - coding interview parody</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Mon, 22 Mar 2021 00:05:00 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/leetcoder-talks-about-his-job-hunt-parody-a8f</link>
      <guid>https://dev.to/renaissanceengineer/leetcoder-talks-about-his-job-hunt-parody-a8f</guid>
      <description>&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/5MYPVS91dcY"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Sometimes making fun of something is the best way to change things, the state of interviewing is a mess so I thought I'd remix a classic meme.&lt;/p&gt;

&lt;p&gt;I'm also going to make a video going over a fairly recent study done by Microsoft that showed their own coding interviews failed miserably and more accurately predicted ability to handle stress rather than actual coding ability.&lt;/p&gt;

&lt;p&gt;Not surprisingly software engineers don't usually code with a stranger staring at them in a semi-hostile environment, so the standard coding interview isn't very useful.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Be sure to follow or subscribe if you're interested in learning about that Microsoft study&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>career</category>
      <category>javascript</category>
      <category>humor</category>
    </item>
    <item>
      <title>Microservices in 4 minutes - Introduction to Microservices</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Mon, 15 Mar 2021 03:29:18 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/microservices-in-4-minutes-introduction-to-microservices-2nla</link>
      <guid>https://dev.to/renaissanceengineer/microservices-in-4-minutes-introduction-to-microservices-2nla</guid>
      <description>&lt;p&gt;Learning microservices can be intimidating for any developer, but it's especially true for junior developers or frontend engineers with little exposure to how things work on the backend. &lt;/p&gt;

&lt;p&gt;The most confusing aspect is that there is really no 100% standard textbook definition about what a microservice truly is.&lt;/p&gt;

&lt;p&gt;In this video I'll try to quickly go over the what, why, and how of microservices so you can get a general understanding of the core principles of microservices and why they are so hyped in the tech world. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Even if you don't have any interest in working on backend programming it's a good idea to at least be exposed to these concepts&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/l4tQ66mDfxU"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;Summary of video:&lt;/p&gt;

&lt;h2&gt;
  
  
  What are microservices
&lt;/h2&gt;

&lt;p&gt;They are a software architecture style that involves breaking an application down into individual pieces that are able to be deployed and developed independently from each other.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits and Downsides
&lt;/h2&gt;

&lt;p&gt;So why are companies using these things? Obviously there are some benefits to justify moving from the monolithic app style that has worked for a long time&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Faster development time - Teams can make their own decisions and for the most part don't need to coordinate new deployments with other teams &lt;/li&gt;
&lt;li&gt;Easier to onboard new hires - New engineers don't need to learn the entire application before contributing, they can start off working on a single microservice&lt;/li&gt;
&lt;li&gt;Scaling- Microservices can be scaled independently depending on traffic demands. Don't have to scale the entire monolith if a single chokepoint is slowing down the app&lt;/li&gt;
&lt;li&gt;Reliability - Because microservices are separated from each other, if a bug is deployed it can be isolated and rolled back without taking down other services&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That's not to say microservices are perfect, there are plenty of tradeoffs that come with using microservices and monoliths are generally recommended for small apps and small companies until they start encountering problems with scaling.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Complexity - A poorly designed microservice architecture can end up being worse than the average monolith&lt;/li&gt;
&lt;li&gt;Communication between microservices - Entire new set of problems created by the fact that microservices are broken up, they need some standard way of communicating with each other&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Where to learn more
&lt;/h2&gt;

&lt;p&gt;This was just a quick summary, I plan on doing more in depth tutorials on microservices so follow or subscribe if you are interested in that. &lt;/p&gt;

&lt;p&gt;Until then here are some good resources if you are interested in learning more:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://martinfowler.com/articles/microservices.html"&gt;https://martinfowler.com/articles/microservices.html&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.nginx.com/blog/introduction-to-microservices/"&gt;https://www.nginx.com/blog/introduction-to-microservices/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.scalyr.com/blog/api-vs-microservices/"&gt;https://www.scalyr.com/blog/api-vs-microservices/&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>webdev</category>
      <category>career</category>
      <category>beginners</category>
    </item>
    <item>
      <title>5 underrated Tech companies that pay more than Google, Microsoft, and Amazon</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Mon, 08 Mar 2021 14:19:39 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/5-underrated-tech-companies-that-pay-more-than-google-microsoft-and-amazon-411b</link>
      <guid>https://dev.to/renaissanceengineer/5-underrated-tech-companies-that-pay-more-than-google-microsoft-and-amazon-411b</guid>
      <description>&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/aaEVJpL62XQ"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;A lot of engineers set their career goal as working at one of the major tech giants. I think this is mainly due to years of essentially propaganda telling people they aren't a "real" engineer unless they jump through all the hoops required to work for those companies.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In reality there are a bunch of other great companies that pay just as much as companies like Google, Facebook, Amazon, etc&lt;/strong&gt;. In fact, many of them pay more. In recent years it has become well known that many of those big companies will give you a lowball offer unless you have a competing offer from another company.&lt;/p&gt;

&lt;p&gt;The companies I talk about in the video above are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Tableau&lt;/li&gt;
&lt;li&gt;Roblox&lt;/li&gt;
&lt;li&gt;Figma&lt;/li&gt;
&lt;li&gt;Snowflake computing&lt;/li&gt;
&lt;li&gt;Plaid&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I'll be covering a lot more of these lesser known tech companies so be sure to follow or subscribe on YT&lt;/p&gt;

</description>
      <category>career</category>
      <category>webdev</category>
      <category>beginners</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Database Sharding Explained- 2021 Database Scaling Tutorial</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Fri, 05 Mar 2021 02:34:30 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/database-sharding-explained-2021-database-scaling-tutorial-5cej</link>
      <guid>https://dev.to/renaissanceengineer/database-sharding-explained-2021-database-scaling-tutorial-5cej</guid>
      <description>&lt;p&gt;If you want to reach your full potential as a developer you need to have at least a basic understanding of how all levels of an application work.&lt;/p&gt;

&lt;h3&gt;
  
  
  At the higher levels for engineers it's more about your ability to design a system rather than pure coding ability. Knowing this stuff is essential if you want to advance your career
&lt;/h3&gt;

&lt;p&gt;In this post I'm going to cover database sharding in depth, as well as some other basic concepts related to database scaling. &lt;/p&gt;

&lt;p&gt;Article Summary:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;What is Database Sharding&lt;/li&gt;
&lt;li&gt;Why is Database Sharding Used&lt;/li&gt;
&lt;li&gt;Pros and Cons of Sharding&lt;/li&gt;
&lt;li&gt;Database Sharding vs Datebase Partitions&lt;/li&gt;
&lt;li&gt;Database Sharding Architectures&lt;/li&gt;
&lt;li&gt;What causes databases to slow down?&lt;/li&gt;
&lt;li&gt;Database Sharding alternatives&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Full Database scaling video
&lt;/h2&gt;

&lt;p&gt;If you prefer watching a video and would also like to learn more about scaling databases beyond just sharding, check out the video below:&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/VhsMXWb5Eew"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  What is Database Sharding
&lt;/h2&gt;

&lt;p&gt;In simple terms it means you are taking your data and breaking it up into "shards", different pieces that together hold all of your data. This allows for applications to scale far beyond the constraints of a single traditional database.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkwhd0eu9et57ii1qfsoh.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkwhd0eu9et57ii1qfsoh.gif" alt="Your database struggling"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In human terms, think about owning a successful bakery. Eventually you get too much work to handle on your own so you hire employees for the tasks of making cookies, cakes, and brownies. You've sharded your work so that your business can get more done than what you could do alone.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why is Database Sharding Used
&lt;/h2&gt;

&lt;p&gt;Databases are sharded for 2 main reasons, replication and handling large amounts of data. &lt;/p&gt;

&lt;h3&gt;
  
  
  Replication
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frgsj6bx7hftb5drz1v5g.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frgsj6bx7hftb5drz1v5g.gif"&gt;&lt;/a&gt;&lt;br&gt;
Sharding allows for replication because we can copy each shard of data onto multiple servers, which makes our application more reliable. If one of those machines goes down, we still have additional machines with the data that can serve requests. With a sharded database your application no longer has a single point of failure and is more fault-tolerant.&lt;/p&gt;

&lt;p&gt;Big data requires sharding for the simple fact that at large scale a single machine can't hold the entire dataset. Imagine Facebook trying to store their petabytes of data in a single database on a single server? It would be impossible. At massive scale, the data has to be sharded into manageable pieces and then distributed over a large number of servers.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits of Sharding
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6cvt130euspqbd2qj7cd.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6cvt130euspqbd2qj7cd.JPG" alt="Horizontal Sharding Diagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Scalability
&lt;/h3&gt;

&lt;p&gt;Without sharding your only option for improving the performance of your database would be vertical scaling. That means adding more disk space, RAM, and faster CPUs to a single machine to try and handle the increasing amount of data your application is handling. &lt;/p&gt;

&lt;p&gt;With sharding you break your data into equal sized, manageable chunks that can be spread across a number of cheap commodity servers which can be scaled up easily. &lt;/p&gt;

&lt;h3&gt;
  
  
  Resiliency
&lt;/h3&gt;

&lt;p&gt;A side effect of having all those small servers means your app is more resilient to failure. You can have each shard stored on multiple servers/nodes.&lt;/p&gt;

&lt;p&gt;This means that even if one server fails, your app can still retrieve the data it needs. If you were relying on a single massive database server you would be in big trouble if it went down.&lt;/p&gt;

&lt;h3&gt;
  
  
  Improved performance
&lt;/h3&gt;

&lt;p&gt;Because your data is broken into smaller pieces, queries only have to search smaller amounts of data. This speeds up database performance and response times.&lt;/p&gt;

&lt;p&gt;You also have the option of distributing those shards across multiple data centers around the world, which means reduced latency and a better overall experience for your users.&lt;/p&gt;

&lt;h2&gt;
  
  
  Downsides of Sharding
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Feyndkiflolonhei8gvsb.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Feyndkiflolonhei8gvsb.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Complexity
&lt;/h3&gt;

&lt;p&gt;Sharding comes at a price, which is the additional complexity of dealing with having your data spread around all those servers. Sharding should always be a last resort when it comes to scaling your database, other alternatives like read replicas and caching should be implemented first because they are much easier to implement.&lt;/p&gt;

&lt;p&gt;When you do have to shard a database, your goal should be to abstract it away from your application developers. To your engineers it should seem like they are just writing to the database like they always have, behind the scenes a service or library should do the heavy lifting of making sure data is distributed to the proper shard. &lt;/p&gt;

&lt;p&gt;Some databases have built-in sharding support and handle this outside the application layer, which reduces the complexity for your team.&lt;/p&gt;

&lt;h3&gt;
  
  
  Data consistency
&lt;/h3&gt;

&lt;p&gt;Keeping data consistent across nodes is one example of additional complexity that comes with sharding. You now have to worry about things like how to update all nodes of a particular shard when data is updated. &lt;/p&gt;

&lt;p&gt;In some cases you could end up serving stale data to your users if something is updated but those changes are not propagated to all the shards serving data to other users.&lt;/p&gt;

&lt;h2&gt;
  
  
  Types of Database Sharding
&lt;/h2&gt;

&lt;p&gt;One of the biggest decisions when sharding your database is how you decide to break up your data. The goal should be to distribute the load equally across all the shards.&lt;/p&gt;

&lt;p&gt;For example, sharding your database into equal sized chunks based on User ID sounds pretty smart and like an ideal solution.&lt;/p&gt;

&lt;p&gt;However, you may run into a similar issue as Instagram, where Justin Bieber's account got significantly higher rates of traffic compared to normal accounts. This resulted in that particular database shard being overloaded constantly despite having the same total number of user accounts partitioned to it. Every time Justin Beiber made a post the entire Instagram app would slow down for users across the world.&lt;/p&gt;

&lt;p&gt;This problem is known as having a "hotspot" or "hot key" in your database. Your goal when picking how to shard your database is to prevent issues like hotspots from impacting your application performance.&lt;/p&gt;

&lt;h2&gt;
  
  
  Database Sharding Architectures
&lt;/h2&gt;

&lt;p&gt;There are several different methodologies for sharding a database. In this section I'll cover a few of the most common strategies.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key based sharding
&lt;/h3&gt;

&lt;p&gt;Key based sharding works by taking a value from a newly submitted piece of data and running it through a hashing function. This hashing function determines which specific shard the data will be written to. The value from the data chosen is known as the shard key.&lt;/p&gt;

&lt;p&gt;A downside of this strategy is the need to remap data to hash values when servers are added or removed.&lt;/p&gt;

&lt;h3&gt;
  
  
  Range based sharding
&lt;/h3&gt;

&lt;p&gt;Range based sharding involves sharding data based on defined ranges of the values being written. Some examples:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Items with a price below $10 and items above $10 get put into different shards&lt;/li&gt;
&lt;li&gt;Items submitted each week are put into a shard&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This type of sharding is intuitive and easy to implement, but could easily result in hotspots and imbalanced data distribution. &lt;/p&gt;

&lt;h3&gt;
  
  
  Lookup service sharding
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffrrplutwoffnlufk9n6v.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffrrplutwoffnlufk9n6v.gif" alt="directory brain"&gt;&lt;/a&gt;&lt;br&gt;
This sharding strategy works by implementing a lookup table that sits in front of the sharded databases. The service tracks the current partitioning scheme and maps to the locations of each shard.&lt;/p&gt;

&lt;p&gt;The benefit of this is that the underlying sharding scheme can be changed without impacting application code. The downside is that the lookup service can become a point of failure.&lt;/p&gt;

&lt;h2&gt;
  
  
  Database Sharding vs Database Partition
&lt;/h2&gt;

&lt;p&gt;The terms "sharding" and "partitioning" get thrown around a lot when talking about databases. For me this was one of the most confusing aspects of learning this stuff because they are often used interchangeably and there is a certain amount of overlap between the terms. &lt;/p&gt;

&lt;p&gt;In this section I'll try to clear up some of the confusion and save you the pain of searching around online trying to find an answer.&lt;/p&gt;

&lt;p&gt;Partitioning is a general term for breaking up a single dataset into multiple pieces. &lt;/p&gt;

&lt;p&gt;Database sharding is technically a subset of database partitioning, specifically a horizontal partition of your data. When you shard you are effectively creating a replica of your current database column schema and then dividing it by the number of shard keys you decide to use.&lt;/p&gt;

&lt;p&gt;A vertical partition involves splitting a database table on columns. An example could be breaking a single User data table into several different tables like personal information and address/location data.&lt;/p&gt;

&lt;h3&gt;
  
  
  Horizontal Sharding
&lt;/h3&gt;

&lt;p&gt;Visualizing horizontal sharding is pretty easy. Imagine having an Excel spreadsheet with a huge amount of rows and a set amount of columns. &lt;/p&gt;

&lt;p&gt;Horizontally sharding this Excel spreadsheet would be done by choosing a column as the shard key, and then choosing how many keys you want to create. For this example we'll choose the "name" column as our shard key.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffncqq4btaz437nr70ydo.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffncqq4btaz437nr70ydo.PNG" alt="Horizontal partition or sharding"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You could split the data in half by creating 2 shards, names A-M and N-Z. If the amount of data is so large that 2 shards isn't enough, you could break it into 26 shards, 1 for each letter. &lt;/p&gt;

&lt;p&gt;In production would be considered a naïve implementation to just shard based on the starting letter, but the core concept is the same. You choose a column of data to shard and then choose how to group that data.&lt;/p&gt;

&lt;h3&gt;
  
  
  Vertical Sharding/Partitioning
&lt;/h3&gt;

&lt;p&gt;Vertical sharding involves splitting your data by column rather than rows. This is less commonly used but can be powerful in certain situations.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0dhfaf1npgknqrq4lnm1.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0dhfaf1npgknqrq4lnm1.JPG" alt="Vertical partition"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A real world example of vertical sharding is Instagram. When popular accounts posted new images the like count would increase extremely fast and cause performance issues. One part of solving this problem involved splitting off the like count from the rest of the photo metadata. &lt;/p&gt;

&lt;p&gt;A good signal that you should vertically partition a table is when you notice lots of queries only requesting a few of the columns at a time. &lt;/p&gt;

&lt;h2&gt;
  
  
  Logical Shard vs Physical Shard
&lt;/h2&gt;

&lt;p&gt;Another confusing aspect when learning about database sharding are the terms logical vs physical shards. &lt;/p&gt;

&lt;p&gt;Logical shards are the chunks of data, for example your users chunked by the starting letter of their name A-Z. &lt;/p&gt;

&lt;p&gt;These logical shards are then distributed across physical shards, which are the actual database node instances that are running on servers like PostgreSQL, MongoDB, or MySQL. &lt;/p&gt;

&lt;p&gt;There can be multiple copies of each logical shard spread across multiple physical instances. The reason for this is reliability. Even if 1 server containing the data we need fails, our application can still retrieve a duplicate copy from another physical shard/database server.&lt;/p&gt;

&lt;h2&gt;
  
  
  Common reasons to shard a database and the cause of slow databases
&lt;/h2&gt;

&lt;p&gt;In this section I will go over what exactly causes databases to slow down. There isn't one single reason and depending on the type of application your database will struggle for various reasons like CPU, RAM, or storage limits. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fts1r95j852muitefn7hi.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fts1r95j852muitefn7hi.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Hard Drive limits
&lt;/h3&gt;

&lt;p&gt;Probably the easiest to understand reason a database would require sharding. In this case you simply have too much data to fit on a single hard drive.&lt;/p&gt;

&lt;p&gt;Even if the application only got a few requests per day, you would still need to shard this database so all the data is available. Vertical scaling AKA getting a bigger hard drive only works for so long and it becomes more cost efficient to use more machines with commodity hard drives at some point&lt;/p&gt;

&lt;h3&gt;
  
  
  High CPU utilization
&lt;/h3&gt;

&lt;p&gt;If you have a large number of users querying your database at the same time your CPU may become the bottleneck that causes your database to slow down. &lt;/p&gt;

&lt;p&gt;In the worst case scenario user requests would begin to timeout because the requests are stuck waiting while the CPU tries to process them. If you've seen a website go down from suddenly getting a bunch of traffic from somewhere like Hacker News or Reddit, this is a likely cause.&lt;/p&gt;

&lt;p&gt;Sharding in this case would spread the load over multiple servers so each can handle a portion of the requests.&lt;/p&gt;

&lt;h3&gt;
  
  
  High Memory utilization
&lt;/h3&gt;

&lt;p&gt;Serving data from RAM is much faster than having to seek the data from disk/hard drive. Pretty much all databases automatically cache the most frequently used data. Problems begin to occur when the DB simply doesn't have enough RAM to serve this data quickly. The DB then falls back to retrieving data from disk which is extremely slow.&lt;/p&gt;

&lt;p&gt;Under high traffic conditions the server won't be able to keep up and much like with high CPU usage the result is that user requests will begin to timeout. Sharding solves this problem in much the same way, more machines each holding a chunk of the overall data means that there is more RAM available to efficiently serve data.&lt;/p&gt;

&lt;h3&gt;
  
  
  Network Bandwidth
&lt;/h3&gt;

&lt;p&gt;Data moves through fiber optic cables that have a fixed capacity. If the amount of data being sent back and forth exceeds that amount, requests will begin to fail. &lt;/p&gt;

&lt;p&gt;Think about network bandwidth like a bucket of water, if you pour in more than it can hold it overflows. In the case of your application, all that overflow results in failed requests.&lt;/p&gt;

&lt;h2&gt;
  
  
  Alternatives to try before sharding your database
&lt;/h2&gt;

&lt;p&gt;There are a number of options available for scaling a database, many of which you should try to use before attempting to shard your database.&lt;/p&gt;

&lt;h3&gt;
  
  
  Database Indexes
&lt;/h3&gt;

&lt;p&gt;A simple way to optimize database performance is to index a table based on a column. This allows the database to look find rows for queries without having to do a full scan of every row in the table. &lt;/p&gt;

&lt;h3&gt;
  
  
  Caching
&lt;/h3&gt;

&lt;p&gt;Caching involves storing data in memory to serve it faster and more efficiently. As you've read above, your database already has some caching built in. To further boost performance and help keep traffic load off the database, most applications have another dedicated caching layer using something like Redis.&lt;/p&gt;

&lt;p&gt;These dedicated servers are used only for caching and sit in front of the database. They store the most frequently accessed data and if possible will handle the response. In the case they don't have the requested data stored, the request will be forwarded to the DB.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fouatzkf77qz5q0dt9z1b.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fouatzkf77qz5q0dt9z1b.JPG" alt="Caching diagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In many web applications reads are far more common than writes. Twitter for example can have millions of reads for a tweet that was written to the database only once. Caching is perfect for these types of read-heavy apps where updates are less frequent.&lt;/p&gt;

&lt;h3&gt;
  
  
  Read Replicas
&lt;/h3&gt;

&lt;p&gt;Read replicas are clones of your database that are configured to only receive read requests from users. This makes them far easier to implement then sharding. All updates and writes are directed towards a single server and those changes are eventually sent to all the read replicas as well.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnezblrxn0z7qpktukl4j.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnezblrxn0z7qpktukl4j.JPG" alt="Read Replicas"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;One problem with using read replicas is stale data. Think about what would happen if a user makes a request for something that has been updated in the main DB, but that change hasn't yet reached the read replicas? They would get an old version of the data. This might not matter for some applications, but could cause major issues in others.&lt;/p&gt;

&lt;h3&gt;
  
  
  Vertical Scaling
&lt;/h3&gt;

&lt;p&gt;The simplest solution, it doesn't require any changes to your DB or application, just move to a bigger server for as long as you can. However, if the traffic to your app is going to increase long term this is basically just kicking the can down the road.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8qnmfereah4nr47e36lj.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8qnmfereah4nr47e36lj.JPG" alt="Vertical Scaling"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Hopefully this post helped you understand database sharding and scaling. It's a complicated subject and takes time for everything to click mentally, so don't worry if your head is still spinning.&lt;/p&gt;

&lt;p&gt;If you found anything confusing let me know in the comments below so I can update the post and clear things up!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj1ga6mkahdbdqzuxbw8y.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj1ga6mkahdbdqzuxbw8y.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>ReactJS Real Time Crypto Dashboard Tutorial</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Wed, 10 Feb 2021 19:37:49 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/reactjs-real-time-crypto-dashboard-tutorial-55m0</link>
      <guid>https://dev.to/renaissanceengineer/reactjs-real-time-crypto-dashboard-tutorial-55m0</guid>
      <description>&lt;p&gt;&lt;strong&gt;Want a quick foundation to build a cool custom portfolio project?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In this video I quickly go over how to use the Coinbase API to grab historical data for cryptocurrencies and also use their real-time websocket API to get data. I'll then show how to format that data so it can be displayed with a ChartJS component and update a price tracker in real-time.&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/5alEc5KuyKg"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/renaissancetroll/reactjs-crypto-api-dashboard"&gt;ReactJS Crypto Api project github repo&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Once you've got the basic project built I show you some examples of how you can extend the project so you have something unique&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Create a card style layout and add routing for each currency&lt;/li&gt;
&lt;li&gt;Add multiple time segments for users to look at price history&lt;/li&gt;
&lt;li&gt;Add authentication with a Coinbase account to place orders&lt;/li&gt;
&lt;li&gt;Add pagination support so users can get more historical data&lt;/li&gt;
&lt;li&gt;Customize the ChartJS styling&lt;/li&gt;
&lt;li&gt;Make Chart real-time by updating latest data point with current price data&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>react</category>
      <category>webdev</category>
      <category>tutorial</category>
      <category>javascript</category>
    </item>
    <item>
      <title>5 Ideas for Web Developer Portfolio Projects that Standout</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Tue, 02 Feb 2021 15:09:24 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/5-ideas-for-web-developer-portfolio-projects-that-standout-2ka4</link>
      <guid>https://dev.to/renaissanceengineer/5-ideas-for-web-developer-portfolio-projects-that-standout-2ka4</guid>
      <description>&lt;p&gt;Calculators, Todo lists, weather apps&lt;/p&gt;

&lt;p&gt;They've all been done to death as portfolio projects&lt;/p&gt;

&lt;p&gt;Not only are they boring to make, they aren't going to help you stand out when it comes to getting a job. Even if you don't directly make any of these projects, I hope they'll give you some inspiration to create something interesting.&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/gMoJdjpdHWo"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;h3&gt;
  
  
  Be sure to subscribe if you want to see more project ideas and tutorials
&lt;/h3&gt;

&lt;h2&gt;
  
  
  Real Time Stock Market Chart or Game
&lt;/h2&gt;

&lt;p&gt;Using the &lt;a href="https://pusher.com/" rel="noopener noreferrer"&gt;Pusher API&lt;/a&gt; makes it easy to PUSH real time data to all users of your application. Some examples of how you could use this for projects would be something like a real time dashboard with stock market data or an online video game that requires shared data, like a chess board.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fubpvrqrumb5fhb8fro14.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fubpvrqrumb5fhb8fro14.JPG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Congress Net Worth Tracker
&lt;/h2&gt;

&lt;p&gt;Use the &lt;a href="https://www.opensecrets.org" rel="noopener noreferrer"&gt;Open Secrets&lt;/a&gt; database or API to get all kinds of data on the members of the US congress.&lt;/p&gt;

&lt;p&gt;One example of what you could do is create a data visualization app that shows the assets and net worth of each member of congress and allow comparisons by party or number of years in congress&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fxzsf3odw08p183fnncxs.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fxzsf3odw08p183fnncxs.JPG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Automated Invites/Letters for Events
&lt;/h2&gt;

&lt;p&gt;Tired of forgetting to send birthday cards for family and friends? Hosting an event and want to send customized invitations without all the work? Using the &lt;a href="https://www.lob.com" rel="noopener noreferrer"&gt;Lob API&lt;/a&gt; you can use code to automate this process with a few lines of code!&lt;/p&gt;

&lt;p&gt;You could create a spreadsheet containing names, addresses, and other data. Then use an image library to make custom images for postcards with the person's name on it. You could also pre-schedule the date you want each letter or postcard sent using a small database&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F81pfyd4w0nqrqw1wqi5s.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F81pfyd4w0nqrqw1wqi5s.JPG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Reddit User Analyzer
&lt;/h2&gt;

&lt;p&gt;Want an easy way to access almost every piece of data on Reddit? The &lt;a href="https://github.com/pushshift/api" rel="noopener noreferrer"&gt;Pushshift API&lt;/a&gt; makes this very easy and is free to use. &lt;/p&gt;

&lt;p&gt;My idea for this is to create a frontend app that queries the API and displays data for the username input. You could use charts and graphs to display the data like most upvoted comments, most frequently posted subreddits, most common words used, and much more.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Ff5fxr3sutuxpig06j76t.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Ff5fxr3sutuxpig06j76t.JPG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Online Reputation Management Tool
&lt;/h2&gt;

&lt;p&gt;Every company is worried about what people are saying about them online, the problem is that it's impossible to manually monitor this. But by using &lt;a href="https://webhose.io" rel="noopener noreferrer"&gt;WebHose&lt;/a&gt; you can automate this process by checking for mentions of keywords using different filters such as date, site URL, and more&lt;/p&gt;

&lt;p&gt;For this project you can create a simple User Interface to allow non-technical users to input keywords that will then be periodically checked and alerts sent to the users.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F1z5inn15o19azfdh78c9.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F1z5inn15o19azfdh78c9.JPG" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;I'll be putting out more project ideas and tutorials soon so be sure to follow or subscribe to my YT channel if you are interested. If you make anything inspired by this post feel free to leave a comment to the github repo so others can check it out!&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>career</category>
      <category>javascript</category>
    </item>
    <item>
      <title>7 Unique APIs for your next project</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Thu, 21 Jan 2021 14:00:59 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/7-unique-apis-for-your-next-project-4hf9</link>
      <guid>https://dev.to/renaissanceengineer/7-unique-apis-for-your-next-project-4hf9</guid>
      <description>&lt;p&gt;Need some inspiration for a new project? In this article I'll go over what I think are 7 of the coolest APIs around that make it quick and easy to build impressive projects. Whether you just want something to help you get a job or create a side project that earns you some money, all of these APIs are valuable.&lt;/p&gt;

&lt;h3&gt;
  
  
  I'll be putting out a video soon with more in-depth project ideas so be sure to subscribe if you're interested in seeing that
&lt;/h3&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/XerRP4zeOzs"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Shodan API
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F3uxrhgm4jgee2bpu3bxy.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F3uxrhgm4jgee2bpu3bxy.JPG" alt="Shodan API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can think of Shodan as Google for every device connected to the internet. They crawl the web and catalog devices. You can sign up for a developer account and programmatically access their data and filter based on numerous factors. Some things people have found exposed and unsecured on Shodan:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A French hydroelectric plant control system&lt;/li&gt;
&lt;li&gt;entire cities transportation grids&lt;/li&gt;
&lt;li&gt;databases&lt;/li&gt;
&lt;li&gt;industrial freezers with 10's of thousands of dollars in goods&lt;/li&gt;
&lt;li&gt;car washes that can be remotely shut down&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;With Shodan you are really only limited by your imagination, just make sure you don't get yourself arrested.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Radar.io API
&lt;/h2&gt;

&lt;p&gt;Radar provides an API that makes it easy to implement various features related to maps and location. With just a few lines of code you can add real-time location tracking, geofencing, and Google Maps like direction and places features.&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fja0v4kndlj2edmrkvptz.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fja0v4kndlj2edmrkvptz.JPG" alt="Radar API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  3. WebHose API
&lt;/h2&gt;

&lt;p&gt;WebHose basically scrapes the entire internet and then organizes the content to make it easily accessible via API. You can query their data using a huge amount of filters. For example, if you want to find the most popular blog post written in the last month about Javascript, you can request that via API and then sort by the number of times it was shared on Facebook or LinkedIn.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fq0532hpjb6okg7cbvlsk.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fq0532hpjb6okg7cbvlsk.JPG" alt="WebHose API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A number of companies use WebHose to see where they are being mentioned online and monitor trends. &lt;/p&gt;

&lt;h2&gt;
  
  
  4. People Data Labs
&lt;/h2&gt;

&lt;p&gt;This API is kind of creepy, but also interesting. I'm not exactly sure how they acquire their data but People Data labs allows you to "enrich" profiles of users on your app. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fa54ygphutwn1p03nd9l2.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fa54ygphutwn1p03nd9l2.JPG" alt="people data labs"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For example if somebody signs up to your app with just an email, you could send that email to PDL's API and it would return a bunch of additional information like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;job title&lt;/li&gt;
&lt;li&gt;social media profiles&lt;/li&gt;
&lt;li&gt;skills&lt;/li&gt;
&lt;li&gt;employer&lt;/li&gt;
&lt;li&gt;much more&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This could be used to help score leads for your sales team, if a Vice President at Google signs up for your app, you probably want to prioritize talking to them and see if you can make some money.&lt;/p&gt;

&lt;h2&gt;
  
  
  5. Crawlera
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fy3t1memiouxqscz9nkwz.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fy3t1memiouxqscz9nkwz.JPG" alt="Crawlera"&gt;&lt;/a&gt;&lt;br&gt;
Lots of beginner tutorials show how to make bots and web scrapers but most sites will block you very quickly. Crawlera is a service created by the people who made the popular python scraping library Scrapy. &lt;/p&gt;

&lt;p&gt;Crawlera automatically rotates IP addresses and makes it look like your scraper is coming from real people rather than an automated program. This allows you to scrape sites like Google and Amazon.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Project Idea&lt;/strong&gt; - Make a Amazon product price tracker, with Crawlera you can schedule your bot to check the listing page every few minutes and update users.&lt;/p&gt;

&lt;h2&gt;
  
  
  6. SpaceX API
&lt;/h2&gt;

&lt;p&gt;A pretty simple API compared to the other ones, but still interesting I think. Just hit the endpoint from your app and retrieve all sorts of data related to SpaceX launches and rockets. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Project Idea&lt;/strong&gt; - Make a dashboard with ReactJS that lets users explore the data provided by the API&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fvbdmnc89eknuq0lfwch9.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fvbdmnc89eknuq0lfwch9.JPG" alt="SpaceX API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  7. Segment
&lt;/h2&gt;

&lt;p&gt;Segment is used to connect data sources from various apps and technologies. Instead of having to build and maintain all these connections between data sources yourself, you just need to work with Segment's API.&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fkkd0bmh6v5u6jy1d0yzg.JPG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fkkd0bmh6v5u6jy1d0yzg.JPG" alt="Segment API"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;If you think I forget any APIs let me know. Also I'd love to see people brainstorming cool ideas in the comments below.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>tutorial</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Weekly Dev Roundup - 7 best things you might have missed</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Sat, 09 Jan 2021 17:24:15 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/weekly-dev-roundup-7-best-things-you-might-have-missed-4bhi</link>
      <guid>https://dev.to/renaissanceengineer/weekly-dev-roundup-7-best-things-you-might-have-missed-4bhi</guid>
      <description>&lt;p&gt;Here's my attempt at gathering the best developer content from the past week, a little bit of everything that you may have missed. These roundups will include articles, videos, Twitter threads, and pretty much any other form of content that people might find useful.&lt;/p&gt;

&lt;h2&gt;
  
  
  If I missed something you think is great, leave a comment below so others can see it!
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. 25 web design trends for 2021
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://medium.com/quick-code/coolest-25-web-design-trends-in-2021-thatll-rock-the-world-388eb1144b7e" rel="noopener noreferrer"&gt;https://medium.com/quick-code/coolest-25-web-design-trends-in-2021-thatll-rock-the-world-388eb1144b7e&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;1st is a cool article listing some design trends with big companies that are starting to spread. I tend to struggle with design and ideas for styling my projects, so I found it pretty useful.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Guide to becoming an ethical hacker
&lt;/h3&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/mdsChhW056A"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;If you are interested learning about cybersecurity or hacking this is a good video to start with, it covers some of the skills you will need to learn. Cyber Mentor also has a huge tutorial going in depth that he did for Free Code Camp.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Pixel Rain image effect tutorial
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fs1gc2vnq0baw561jhr6h.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fs1gc2vnq0baw561jhr6h.PNG" alt="pixel rain effect"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://www.reddit.com/r/webdev/comments/kof92j/pixel_rain_effect_experiments_with_source_code/" rel="noopener noreferrer"&gt;https://www.reddit.com/r/webdev/comments/kof92j/pixel_rain_effect_experiments_with_source_code/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A really cool tutorial with source code you can play with in Codepen. Takes a normal image and creates an animated pixel effect.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. System Design Crash Course
&lt;/h3&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/MbjObHmDbZo"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;One of the biggest factors in going from a junior to senior engineer isn't just coding ability. Companies are looking for people who understand the whole system that makes up an application. This video I made for Geek's lesson is a solid crash course to get you started with the basics and includes an interview style example&lt;/p&gt;

&lt;h3&gt;
  
  
  5. Cartoonify images with Python
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F2909lsenjhebius8nk5c.PNG" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F2909lsenjhebius8nk5c.PNG" alt="python cartoon image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://towardsdatascience.com/turn-photos-into-cartoons-using-python-bb1a9f578a7e" rel="noopener noreferrer"&gt;https://towardsdatascience.com/turn-photos-into-cartoons-using-python-bb1a9f578a7e&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This tutorial uses Python and OpenCV to turn a normal image into a cartoon version. It includes a Google Colab notebook so you can test out the code without needing anything setup on your computer. I think you could extend this project if you wanted by creating a serverless function and a frontend and creating an app to let users upload images. Would be a good portfolio project&lt;/p&gt;

&lt;h3&gt;
  
  
  6. Analysis of Steam's login flow
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://owlspace.xyz/cybersec/steam-login/" rel="noopener noreferrer"&gt;https://owlspace.xyz/cybersec/steam-login/&lt;/a&gt;&lt;br&gt;
This article is not only an interesting analysis of how Steam logs in users, but also will make you appreciate that making applications has become much easier than it was even 10 years ago.&lt;/p&gt;

&lt;h3&gt;
  
  
  7. Interview prep guide for Facebook
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://daqo.medium.com/facebook-senior-software-engineer-interview-the-only-post-youll-need-to-read-e4604ff2336d" rel="noopener noreferrer"&gt;https://daqo.medium.com/facebook-senior-software-engineer-interview-the-only-post-youll-need-to-read-e4604ff2336d&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This guide is for Facebook in particular but applies to really any major tech company. If you have a long term goal of joining one of those companies it might be worth checking out this guide to get an idea of what you'll need to know.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>productivity</category>
      <category>react</category>
    </item>
    <item>
      <title>Top 8 APIs for making a project in 2021</title>
      <dc:creator>Renaissance Engineer</dc:creator>
      <pubDate>Mon, 28 Dec 2020 19:31:56 +0000</pubDate>
      <link>https://dev.to/renaissanceengineer/top-8-apis-for-making-a-project-in-2021-19n3</link>
      <guid>https://dev.to/renaissanceengineer/top-8-apis-for-making-a-project-in-2021-19n3</guid>
      <description>&lt;p&gt;Want to make a project for your portfolio or maybe a side project but don't know where to start?&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In this video I'll show you 8 really cool APIs&lt;/strong&gt; and give some of my own ideas for how to use each of them in a unique project that will catch people's attention. &lt;/p&gt;

&lt;p&gt;If you need some inspiration to start a new project in 2021 be sure to watch&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/3ZRBDIA8C6E"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Printful - Lets you upload designs, preview items, and then order almost any type of merchandise via API. Printful handles shipping and manufacturing&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Mux Video- Handles all the complexity of working with video, just upload the file and Mux creates multiple versions of it and pushes to a CDN. Also supports live streaming&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Lob - Lets you send postcards, letters, checks, and more with a few lines of code&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Twilio - Already well known for SMS, but they've expanded their product range a ton and have a bunch of new features to play around with&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Plaid - Makes it easy to connect to users bank accounts and takes care of security and regulations&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Google Cloud AI - Could have put a few different companies here but I like Google's AI APIs because they give you $300 in free credit, plus most people already have a Google account so sign up is easy&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Coinbase - Free public API for real time crypto price data via websocket, also historical data. With an account you can place orders if you wanted to make a trading bot&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Open Secrets - Provides data on pretty much any politicians in Congress, voting records, fundraising, and lobbying&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>javascript</category>
      <category>tutorial</category>
    </item>
  </channel>
</rss>
