The world’s leading publication for data science, AI, and ML professionals.

A Data Scientist’s Guide to Making a Website

A Comprehensive Guide to Learning HTML/CSS As You Go

Fear of HTML is the Mind-Killer
Fear of HTML is the Mind-Killer

Apart from modeling, data scientists spend a lot of time writing. They write to communicate insights, they blog, and they tweet. The number of topics in the domain of data science is exceedingly vast. From NLP to facial recognition, from predicting customer churn to detecting rare deep space events, the bounds of focus are without limit. However, most data science experience involves Python and data collection: rarely do data scientists deal with HTML, CSS, and JavaScript, the so-called web dev languages. Ironically, this lack of design experience limits the reach of data scientists who might otherwise display their projects in a beautiful portfolio or blog. In reality, making your own data science website or blog is quite easy, despite the upfront fear of CSS and HTML, to such a degree that you can learn all you need in a few days to produce a beautiful personal website.

There is a truly baffling amount of resources to make your own website, whether for personal or company use, and even more truly baffling amount of tutorials on how to make them, and this is one of them!

My hope with this post is to provide a clean, up-to-date, minimal guide for making a website with little-to-zero knowledge of HTML, CSS, or JavaScript.

The most confusing parts of web development aren’t even HTML or CSS. With Google and Stack Overflow, the tricks and tools for modifying a webpage’s appearance are relatively straightforward. Rather, the difficulty comes from understanding how the technologies weave together, and what abstractions make up a ‘website.’

This post will walk through the three main abstractions of a website:

  1. HTML, CSS, and JavaScript, and the reason why you shouldn’t worry about them.
  2. Hosting. Where does the content of your page actually live?
  3. Domain name. How do you get to that page via a traditional custom ‘.com’ name?

Step 1: HTML, CSS, and JavaScript

Here’s a quick overview of what they do, just for a basic understanding or refresher.

HTML…

is ‘hypertext markup language’, and it’s just used for laying out the building blocks of a webpage at the most basic level. All the tags you see like <p>code stuff</p> are HTML, and even right-clicking this page you’re reading and clicking ‘Inspect’ will open your browser’s editor to show you the immediate, backbone layout of the page. HTML mostly concerns big chunks of a webpage in terms of rectangles. HTML has nothing to do with style, color, or interactivity. Its code isn’t really functional, or strictly-speaking programming. Rather, HTML is the bricks underneath the paint. You can’t style it or interact with it, but you can paint it (CSS) and add doors and windows (JavaScript) later.

CSS…

is ‘cascading style sheets’, and it relates to appearance and style. It concerns different font families, different font sizes, colors, opacity, layering, and shape alterations. It may seem like the most surface level aspect of design, but CSS actually does quite a bit of heavy lifting for user-experience. Even the best under-the-hood design and functionality (driven by JavaScript) is useless without an intuitive feel driven by clever CSS utilization. Whenever you hover the cursor over a ‘thumbs up’ icon on social media and it changes color or size, that’s the unconscious power of CSS driving a sleek and and satisfying user experience.

JavaScript…

is the actual bona-fide ‘programming language’ of the trio. A programming language is generally a title reserved for functionality and interactivity due to the context of interconnected abstractions, and JavaScript handles those abstractions in the form of functions and data flow under the hood of a website. Whenever a user clicks on a button, fills out a form or a search bar, or clicks on a link to another page, invisible scripts must be run to handle the intended effect. These come in the form of basic functions, as well as classes and objects.

All three of these things…

are things you shouldn’t worry about for building your own website! Unless you’re a master web developer or building a website from scratch for the challenge, you can pick up the tutorial-free basics of HTML, CSS, and JavaScript up as you go, and this is possible because of templates.

What is a template?

It’s a pre-developed codebase of HTML, CSS, and JavaScript with a simple enough backbone to alter intuitively. A lot of intro programmers might perceive this as cheating at first, because it doesn’t feel like you’re building your own brand or putting in the effort. But it’s crucial for the learning process, because HTML and CSS are best learned top-down. Tutorials just don’t provide the personal investment necessary to learn.

Formal tutorials provide structured knowledge, but building your own brand is a fundamentally messy and idiosyncratic process, and learning the basics of HTML tags and CSS rules will stick much better by using a beautiful template, and making small alterations as you go. First change the and <p> tags to see what changes, and you will pretty quickly obtain a personalized, if stylistically unoriginal, website. Start altering some CSS rules to see how colors and fonts change, and pretty quickly you’ll have developed your own stylized website. Learning is always a process of <strong>interconnected experience, and using a template is the fastest way to learn.</strong></p> <p class="wp-block-paragraph">Use Google to find ‘free html5 templates’ or ‘free responsive html templates 2020’, etc. There are endless options, so just pick one that looks nice and simple. I used HTML5 UP, a Creative Commons free template base, but any of them will be more or less the same. <a href="https://towardsdatascience.com/tag/github/" title="Github">Github</a> Pages is also integrated with <a href="https://jekyllrb.com/">Jekyll themes</a>, another free template source, and because hosting (see Step 2) on Github pages is free, Jekyll is a great option for building a quick blog or personal website.</p> <p class="wp-block-paragraph">Once you’ve downloaded a template or theme, open up the file base as a new project in your favorite code editor, which should probably be Visual Studio Code, and start tinkering! The <code>index.html</code> file contains the HTML, the building blocks where you can mess around with text and structure, and the <code>main.css</code> file contains the CSS rules. Just play around and pretty quickly you’ll see how much you can do without any tutorials. Open up the <code>index.html</code> file (which should open by default in your browser) to preview it, and then trial-and-error for hours by making small alterations to observe which code changes produce which visual changes. Then, <strong>only use tutorials or guides once you understand the context of your confusion enough to judge whether a tutorial will be worth it. Most of the time, a long sequence of quick Google/Stack-overflow solutions is all you really need to learn.</strong></p> <h2 class="wp-block-heading">Step 2: Hosting</h2> <p class="wp-block-paragraph">This is a relatively simple step. Most of the effort behind building a website involves getting a webpage to look good, and a <em>lot</em> of that work is CSS. Once that’s done, you just have to find a place for that code to live ‘in the wild’. If you want your website to be accessed from anywhere, anytime, then you should take advantage of any major free hosting service on the web. The standard free hosting location is <a href="https://guides.github.com/features/pages/">Github Pages</a> for smaller websites such as blogs and personal websites, and the process of setting it up is straightforward. It pretty much involves creating or initializing a repository on Github with the code on your computer (in the project directory you used in Visual Studio Code, for example), making it public, and setting up Github Pages in ‘Settings’. In ‘Settings’, scroll down to ‘Source’, and select ‘master branch’ in order to make the <a href="https://towardsdatascience.com/tag/html/" title="HTML">HTML</a> code in that repository visible at: your_username.github.io/your_project_repository_name</p> <p class="wp-block-paragraph">For example, if my Github profile name were <code>bluepanda</code>, and my website repository was named <code>bamboo</code>, and Github Pages is enabled in the manner above, then after a short delay the URL <code>bluepanda.github.io/bamboo</code> should display your website! A good <a href="https://medium.com/coderbyte/setting-up-a-personal-website-with-github-pages-2f64be0189f0">Github Pages guide is here</a>, though <a href="https://docs.github.com/en/github/working-with-github-pages/about-github-pages">the documentation</a> is always helpful for an up-to-date guide.</p> <h2 class="wp-block-heading">Step 3: Domain Name</h2> <p class="wp-block-paragraph">How do you finally get your website set up at a custom domain name such as <code>bamboo.com</code>, rather than the slightly awkward <code>bluepanda.github.io/bamboo</code> ?This step is quite quick and easy, but a little strange and intimidating due to how complex configuring DNS settings feels. First, you’ll need to look for a domain name provider! This will cost money, but usually on the order of $8–$12 a year. It’s as simple as searching for your custom desired domain such as <code>bamboo.com</code> on your provider of choice (a quick Google of ‘domain name providers’ should suffice to provide the main big ones, but they’re all basically the same), and then paying!</p> <p class="wp-block-paragraph">Then comes the DNS settings, and it’s the trickiest part. The important thing to know is that it’s easy to do, and you can worry about understanding it later. In the meantime, it’s definitely worth just following <a href="https://docs.github.com/en/github/working-with-github-pages/managing-a-custom-domain-for-your-github-pages-site">the documentation</a> step-by-step. The steps merely involve getting a <code>CNAME</code> file added to the repository by adding your custom domain name (such as <code>bamboo.com</code>) in the Github Pages settings, as well as setting up an <code>A</code> record with your DNS provider. A little Googling may be useful here if you run into confusion, but Github’s documentation for setting up a domain name is pretty good.</p> <p class="wp-block-paragraph">And that’s it! Using an <strong>1) HTML template, 2) Hosting it on Github Pages, and 3) Registering that repository with a custom domain name</strong> are all of the steps to creating your own website! Even if you’re already quite experienced with some of the steps in this guide, I hope it’s been useful to see how all the steps connect, since I’ve found that rarely are Steps 1–3 in this guide integrated together in one <a href="https://towardsdatascience.com/tag/tutorial/" title="Tutorial">Tutorial</a>.</p> <p class="wp-block-paragraph">Thanks for reading!</p></div> </div> <hr class="wp-block-separator has-alpha-channel-opacity is-style-dotted" style="margin-top:var(--wp--preset--spacing--64);margin-bottom:var(--wp--preset--spacing--64)" /> <div class="wp-block-group has-global-padding is-layout-constrained wp-container-core-group-is-layout-17 wp-block-group-is-layout-constrained"> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-14 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-13 wp-block-group-is-layout-flex"> <p class="has-eyebrow-1-font-size wp-block-paragraph" style="text-transform:uppercase">Written By</p> <div style="font-style:normal;font-weight:700;text-transform:capitalize;" class="wp-block-post-author-name has-heading-5-font-size">Brayton Hall</div> <div class="wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex"> <DIV class="wp-block-button"><a href="https://towardsdatascience.com/author/braytonhall/" class="wp-block-button__link wp-element-button">See all from Brayton Hall</a></DIV> </div> </div> </div> <div class="wp-block-group is-layout-flex wp-block-group-is-layout-flex"> <p class="has-body-2-font-size wp-block-paragraph" style="font-style:normal;font-weight:700">Topics:</p> <div class="taxonomy-post_tag wp-block-post-terms"><a href="https://towardsdatascience.com/tag/css/" rel="tag">CSS</a><span class="wp-block-post-terms__separator">, </span><a href="https://towardsdatascience.com/tag/github/" rel="tag">Github</a><span class="wp-block-post-terms__separator">, </span><a href="https://towardsdatascience.com/tag/html/" rel="tag">HTML</a><span class="wp-block-post-terms__separator">, </span><a href="https://towardsdatascience.com/tag/tutorial/" rel="tag">Tutorial</a><span class="wp-block-post-terms__separator">, </span><a href="https://towardsdatascience.com/tag/web-development/" rel="tag">Web Development</a></div> </div> <div class="wp-block-group is-layout-flex wp-block-group-is-layout-flex"> <p class="has-body-2-font-size wp-block-paragraph" style="font-style:normal;font-weight:700">Share this article:</p> <ul class="wp-block-outermost-social-sharing has-icon-color is-style-logos-only is-layout-flex wp-block-social-sharing-is-layout-flex"> <li style="color: var(--wp--custom--color--wild-blue-yonder); border-radius:100px;border-width:1px; padding-top:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);" class="outermost-social-sharing-link outermost-social-sharing-link-facebook has-wild-blue-yonder-color wp-block-outermost-social-sharing-link"> <a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Ftowardsdatascience.com%2Fjust-make-a-website-7c57f8f021c%2F&title=A%20Data%20Scientist%27s%20Guide%20to%20Making%20a%20Website" aria-label="Share on Facebook" rel="noopener nofollow" target="_blank" class="wp-block-outermost-social-sharing-link-anchor"> <svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M12 2C6.5 2 2 6.5 2 12c0 5 3.7 9.1 8.4 9.9v-7H7.9V12h2.5V9.8c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.2.2 2.2.2v2.5h-1.3c-1.2 0-1.6.8-1.6 1.6V12h2.8l-.4 2.9h-2.3v7C18.3 21.1 22 17 22 12c0-5.5-4.5-10-10-10z"></path></svg> <span class="wp-block-outermost-social-sharing-link-label screen-reader-text"> Share on Facebook </span> </a> </li> <li style="color: var(--wp--custom--color--wild-blue-yonder); border-radius:100px;border-width:1px; padding-top:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);" class="outermost-social-sharing-link outermost-social-sharing-link-linkedin has-wild-blue-yonder-color wp-block-outermost-social-sharing-link"> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Ftowardsdatascience.com%2Fjust-make-a-website-7c57f8f021c%2F&title=A%20Data%20Scientist%27s%20Guide%20to%20Making%20a%20Website" aria-label="Share on LinkedIn" rel="noopener nofollow" target="_blank" class="wp-block-outermost-social-sharing-link-anchor"> <svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M19.7,3H4.3C3.582,3,3,3.582,3,4.3v15.4C3,20.418,3.582,21,4.3,21h15.4c0.718,0,1.3-0.582,1.3-1.3V4.3 C21,3.582,20.418,3,19.7,3z M8.339,18.338H5.667v-8.59h2.672V18.338z M7.004,8.574c-0.857,0-1.549-0.694-1.549-1.548 c0-0.855,0.691-1.548,1.549-1.548c0.854,0,1.547,0.694,1.547,1.548C8.551,7.881,7.858,8.574,7.004,8.574z M18.339,18.338h-2.669 v-4.177c0-0.996-0.017-2.278-1.387-2.278c-1.389,0-1.601,1.086-1.601,2.206v4.249h-2.667v-8.59h2.559v1.174h0.037 c0.356-0.675,1.227-1.387,2.526-1.387c2.703,0,3.203,1.779,3.203,4.092V18.338z"></path></svg> <span class="wp-block-outermost-social-sharing-link-label screen-reader-text"> Share on LinkedIn </span> </a> </li> <li style="color: var(--wp--custom--color--wild-blue-yonder); border-radius:100px;border-width:1px; padding-top:var(--wp--preset--spacing--8);padding-bottom:var(--wp--preset--spacing--8);padding-left:var(--wp--preset--spacing--8);padding-right:var(--wp--preset--spacing--8);" class="outermost-social-sharing-link outermost-social-sharing-link-x has-wild-blue-yonder-color wp-block-outermost-social-sharing-link"> <a href="https://x.com/share?url=https%3A%2F%2Ftowardsdatascience.com%2Fjust-make-a-website-7c57f8f021c%2F&text=A%20Data%20Scientist%27s%20Guide%20to%20Making%20a%20Website" aria-label="Share on X" rel="noopener nofollow" target="_blank" class="wp-block-outermost-social-sharing-link-anchor"> <svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M13.982 10.622 20.54 3h-1.554l-5.693 6.618L8.745 3H3.5l6.876 10.007L3.5 21h1.554l6.012-6.989L15.868 21h5.245l-7.131-10.378Zm-2.128 2.474-.697-.997-5.543-7.93H8l4.474 6.4.697.996 5.815 8.318h-2.387l-4.745-6.787Z"></path></svg> <span class="wp-block-outermost-social-sharing-link-label screen-reader-text"> Share on X </span> </a> </li> </ul> </div> </div> <div style="height:40px" aria-hidden="true" class="wp-block-spacer"></div> <div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained"> </div> </main> <div class="wp-block-group has-surface-secondary-background-color has-background has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--80);padding-bottom:var(--wp--preset--spacing--80)"> <div class="wp-block-group is-layout-flow wp-block-group-is-layout-flow"> <h2 class="wp-block-heading has-heading-3-font-size">Related Articles</h2> <div class="wp-block-query alignwide is-layout-flow wp-block-query-is-layout-flow"> <ul class="wp-block-post-template is-layout-grid wp-container-core-post-template-is-layout-1 wp-block-post-template-is-layout-grid is-entire-card-clickable"><li class="wp-block-post post-13474 post type-post status-publish format-standard has-post-thumbnail hentry category-data-science category-machine-learning category-nlp category-web-development tag-data-science tag-hands-on-tutorials tag-machine-learning tag-nlp tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-25 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-24 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-20 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/building-web-applications-with-streamlit-for-nlp-projects-cdc1cf0b38db/" target="_self" >Building Web Applications with Streamlit for NLP Projects</a></h2> <a href="https://towardsdatascience.com/category/data-science/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Data Science </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">A code demonstration and explanation of the basics of Streamlit while solving NLP tasks such… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-23 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-22 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/ram-vegiraju/" target="_self" class="wp-block-post-author-name__link">Ram Vegiraju</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-21 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2020-11-09T06:58:40-05:00">November 9, 2020</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 7 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-14926 post type-post status-publish format-standard has-post-thumbnail hentry category-web-development tag-python tag-r tag-sankey-diagram tag-visualization tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-31 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <figure style="aspect-ratio:16/9;width:100%;" class="wp-block-post-featured-image"><img width="1777" height="1040" src="https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw.png" class="attachment-post-thumbnail size-post-thumbnail has-transparency wp-post-image" alt="" style="--dominant-color: #ecebe7;width:100%;height:100%;object-fit:cover;" decoding="async" loading="lazy" srcset="https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw.png 1777w, https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw-300x176.png 300w, https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw-1024x599.png 1024w, https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw-768x449.png 768w, https://towardsdatascience.com/wp-content/uploads/2022/10/1nbgxuLm_nld5_NhWS5B_Aw-1536x899.png 1536w" sizes="auto, (max-width: 1777px) 100vw, 1777px" data-has-transparency="true" data-dominant-color="ecebe7" /></figure> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-30 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-26 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/the-essence-of-drawing-sankey-plot-491fb2cb234/" target="_self" >The essence of drawing Sankey Plot</a></h2> <a href="https://towardsdatascience.com/category/programming/web-development/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Web Development </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Sankey plot is a very nice and neat way to visualize how the values flow… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-29 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-28 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/frankligy/" target="_self" class="wp-block-post-author-name__link">Guangyuan(Frank) Li</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-27 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-10-30T00:20:34-05:00">October 30, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 5 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-15823 post type-post status-publish format-standard has-post-thumbnail hentry category-data-science category-productivity category-technology category-web-development tag-data-science tag-productivity tag-tableau tag-technology tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-37 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <figure style="aspect-ratio:16/9;width:100%;" class="wp-block-post-featured-image"><img width="755" height="578" src="https://towardsdatascience.com/wp-content/uploads/2022/11/1kAGWnHy5F65dRJLj47I4Ww.png" class="attachment-post-thumbnail size-post-thumbnail has-transparency wp-post-image" alt="Image by Author | A map rendered in Tableau by a spatial data file | Showcasing the distribution of citizens (65u0026amp;Over) in Singapore by Planning Areas" style="--dominant-color: #eedac0;width:100%;height:100%;object-fit:cover;" decoding="async" loading="lazy" srcset="https://towardsdatascience.com/wp-content/uploads/2022/11/1kAGWnHy5F65dRJLj47I4Ww.png 755w, https://towardsdatascience.com/wp-content/uploads/2022/11/1kAGWnHy5F65dRJLj47I4Ww-300x230.png 300w" sizes="auto, (max-width: 755px) 100vw, 755px" data-has-transparency="true" data-dominant-color="eedac0" /></figure> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-36 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-32 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/how-to-plot-a-custom-map-image-on-tableau-dashboard-in-just-3-easy-steps-no-calculations-required-8db0d41680c4/" target="_self" >How to Plot a Custom Map Image on Tableau Dashboard in just 3 Easy Steps - No calculations required.</a></h2> <a href="https://towardsdatascience.com/category/data-science/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Data Science </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Tableau as a dashboarding tool offers a wide range of chart options for its users.… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-35 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-34 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/geek-cc/" target="_self" class="wp-block-post-author-name__link">Charmaine Chui</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-33 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-11-07T14:06:34-05:00">November 7, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 3 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-16389 post type-post status-publish format-standard has-post-thumbnail hentry category-web-development tag-deep-dives tag-geospatial tag-plotly tag-react tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-43 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <figure style="aspect-ratio:16/9;width:100%;" class="wp-block-post-featured-image"><img width="2560" height="1707" src="https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-scaled.jpg" class="attachment-post-thumbnail size-post-thumbnail not-transparent wp-post-image" alt="" style="--dominant-color: #1e2b2f;width:100%;height:100%;object-fit:cover;" decoding="async" loading="lazy" srcset="https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-scaled.jpg 2560w, https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-300x200.jpg 300w, https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-1024x683.jpg 1024w, https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-768x512.jpg 768w, https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-1536x1024.jpg 1536w, https://towardsdatascience.com/wp-content/uploads/2023/02/0Za8SFVwrLri4kHKe-2048x1365.jpg 2048w" sizes="auto, (max-width: 2560px) 100vw, 2560px" data-has-transparency="false" data-dominant-color="1e2b2f" /></figure> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-42 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-38 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/a-step-by-step-guide-to-develop-a-map-based-application-part-ii-6d3fa7dbd8b9/" target="_self" >How to use React to build Web Apps</a></h2> <a href="https://towardsdatascience.com/category/programming/web-development/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Web Development </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Maps are a powerful tool for visualizing and understanding geographic data but they need specific… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-41 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-40 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/jacky-kaub/" target="_self" class="wp-block-post-author-name__link">Jacky Kaub</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-39 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2023-02-09T01:46:33-05:00">February 9, 2023</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 24 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-17462 post type-post status-publish format-standard has-post-thumbnail hentry category-programming category-technology category-web-development tag-api tag-programming tag-tech tag-technology tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-49 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <figure style="aspect-ratio:16/9;width:100%;" class="wp-block-post-featured-image"><img width="490" height="367" src="https://towardsdatascience.com/wp-content/uploads/2022/01/1BVWrtVhK0qW99pJ1rol7EA.jpeg" class="attachment-post-thumbnail size-post-thumbnail not-transparent wp-post-image" alt="" style="--dominant-color: #91948a;width:100%;height:100%;object-fit:cover;" decoding="async" loading="lazy" srcset="https://towardsdatascience.com/wp-content/uploads/2022/01/1BVWrtVhK0qW99pJ1rol7EA.jpeg 490w, https://towardsdatascience.com/wp-content/uploads/2022/01/1BVWrtVhK0qW99pJ1rol7EA-300x225.jpeg 300w" sizes="auto, (max-width: 490px) 100vw, 490px" data-has-transparency="false" data-dominant-color="91948a" /></figure> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-48 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-44 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/top-7-hidden-api-gems-to-include-in-your-next-project-548e66c34ff9/" target="_self" >Top 7 Hidden API Gems to Include in your Next Project</a></h2> <a href="https://towardsdatascience.com/category/programming/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Programming </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Introduction We programmers have a tendency to reinvent the wheel. Can reinventing the wheel be… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-47 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-46 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/caineardayfio/" target="_self" class="wp-block-post-author-name__link">Caine Ardayfio</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-45 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-01-17T14:43:32-05:00">January 17, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 4 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-17579 post type-post status-publish format-standard has-post-thumbnail hentry category-javascript category-web-development tag-application tag-css tag-javascript tag-tutorial tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-55 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-54 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-50 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/dive-into-modern-web-deployment-quickstart-guide-on-building-dynamic-applications-9e1eb2979f1e/" target="_self" >Dive into Modern Web Deployment: Quickstart Guide on Building Dynamic Applications</a></h2> <a href="https://towardsdatascience.com/category/javascript/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> JavaScript </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Photo by Mark Harpur on Unsplash There are adequate choices on the tools and workflows… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-53 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-52 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/reddotblues/" target="_self" class="wp-block-post-author-name__link">Sean Zhai</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-51 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-01-10T14:30:14-05:00">January 10, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 5 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-17929 post type-post status-publish format-standard has-post-thumbnail hentry category-data-science category-programming category-web-development tag-data-science tag-programming tag-react tag-typescript tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-61 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <figure style="aspect-ratio:16/9;width:100%;" class="wp-block-post-featured-image"><img width="2560" height="1920" src="https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-scaled.jpg" class="attachment-post-thumbnail size-post-thumbnail not-transparent wp-post-image" alt="" style="--dominant-color: #0d0e0f;width:100%;height:100%;object-fit:cover;" decoding="async" loading="lazy" srcset="https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-scaled.jpg 2560w, https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-300x225.jpg 300w, https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-1024x768.jpg 1024w, https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-768x576.jpg 768w, https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-1536x1152.jpg 1536w, https://towardsdatascience.com/wp-content/uploads/2022/02/0Em26lI7RvPV0XqBG-2048x1536.jpg 2048w" sizes="auto, (max-width: 2560px) 100vw, 2560px" data-has-transparency="false" data-dominant-color="0d0e0f" /></figure> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-60 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-56 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/web-development-notes-from-a-data-scientist-95e4794fb4ab/" target="_self" >Web Development Notes from a Data Scientist</a></h2> <a href="https://towardsdatascience.com/category/data-science/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Data Science </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Who should read this? Myself: one of my 2022 career goals is to become a… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-59 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-58 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/wen_yang/" target="_self" class="wp-block-post-author-name__link">Wen Yang</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-57 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-02-18T06:59:24-05:00">February 18, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 7 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-18089 post type-post status-publish format-standard has-post-thumbnail hentry category-artificial-intelligence category-data-science category-machine-learning category-programming category-web-development tag-artificial-intelligence tag-data-science tag-machine-learning tag-programming tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-67 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-66 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-62 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/how-to-make-a-free-serverless-interactive-dashboard-in-minutes-e6ce5a1088e0/" target="_self" >How To Make a Free, Serverless, Interactive Dashboard in Minutes</a></h2> <a href="https://towardsdatascience.com/category/artificial-intelligence/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Artificial Intelligence </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Photo by Arie Wubben on Unsplash Instead of sending a visualization to a colleague, why… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-65 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-64 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/jamesasher4994/" target="_self" class="wp-block-post-author-name__link">James Asher</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-63 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-02-11T12:36:49-05:00">February 11, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 8 min read</div> </div> </div> </div> </div> </div> </li><li class="wp-block-post post-18224 post type-post status-publish format-standard has-post-thumbnail hentry category-data-science category-web-development tag-api tag-beginners-guide tag-data-science tag-web-development"> <div class="wp-block-group alignwide is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-73 wp-block-group-is-layout-flex wp-block-pattern wp-block-null"> <div class="wp-block-group alignwide is-style-default is-vertical is-layout-flex wp-container-core-group-is-layout-72 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--10);padding-right:0;padding-left:0"> <div class="wp-block-group is-reversed is-vertical is-layout-flex wp-container-core-group-is-layout-68 wp-block-group-is-layout-flex"> <h2 style="margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;" class="has-link-color alignwide wp-elements-c804df8ecfea890347697a4469c7a87f wp-block-post-title has-text-color has-text-primary-color has-heading-6-font-size"><a href="https://towardsdatascience.com/what-is-an-api-easily-explained-d153a736a55f/" target="_self" >Demystifying APIs: A Comprehensive Guide to Understanding Application Programming Interfaces</a></h2> <a href="https://towardsdatascience.com/category/data-science/" style="text-transform:uppercase;" class="is-taxonomy-category wp-block-tenup-post-primary-term has-text-color has-text-secondary-color has-eyebrow-1-font-size"> Data Science </a> </div> <div class="has-link-color wp-elements-9b2da9e78c2e95c41dab8b5a7bd89187 wp-block-post-excerpt has-text-color has-text-secondary-color"><p class="wp-block-post-excerpt__excerpt">Learn what APIs are, how they work, and how to use them in your software… </p></div> <div class="wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-71 wp-block-group-is-layout-flex"> <div class="wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-70 wp-block-group-is-layout-flex"> <div style="text-decoration:none;" class="has-link-color wp-elements-405d4e0f55fae1c84a82bd83ba2e27c0 wp-block-post-author-name has-text-color has-blue-gray-color has-caption-1-font-size"><a href="https://towardsdatascience.com/author/niklas_lang/" target="_self" class="wp-block-post-author-name__link">Niklas Lang</a></div> <div class="wp-block-group has-text-secondary-color has-text-color has-link-color wp-elements-421d182eef1a5225f64372b8a5605ad9 is-nowrap is-layout-flex wp-container-core-group-is-layout-69 wp-block-group-is-layout-flex"> <div class="has-link-color wp-elements-2f08df38809735c44d27c382513ecb52 wp-block-post-date has-text-color has-text-secondary-color has-caption-1-font-size"><time datetime="2022-07-23T07:00:00-05:00">July 23, 2022</time></div> <div class="wp-elements-717bb1e0e8956d465f5b94f3ba248dbf wp-block-tenup-post-time-to-read has-text-color has-text-secondary-color has-caption-1-font-size"> 8 min read</div> </div> </div> </div> </div> </div> </li></ul> </div> </div> </div> </div> <footer class="wp-block-template-part wp-block-template-part--footer"> <div class="wp-block-group is-style-section-brand has-spindle-color has-text-color has-link-color wp-elements-73818550390986c7c1234e2751e7730f has-global-padding is-layout-constrained wp-container-core-group-is-layout-79 wp-block-group-is-layout-constrained is-style-section-brand--7" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--32);padding-right:var(--wp--preset--spacing--16);padding-bottom:var(--wp--preset--spacing--32);padding-left:var(--wp--preset--spacing--16)"> <div class="wp-block-group is-content-justification-center is-nowrap is-layout-flex wp-container-core-group-is-layout-77 wp-block-group-is-layout-flex"> <ul class="wp-block-social-links has-large-icon-size has-icon-color is-style-logos-only is-layout-flex wp-block-social-links-is-layout-flex"><li style="color: var(--wp--custom--color--spindle); " class="wp-social-link wp-social-link-youtube has-spindle-color wp-block-social-link"><a rel="noopener nofollow" target="_blank" href="https://www.youtube.com/c/TowardsDataScience" class="wp-block-social-link-anchor"><svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M21.8,8.001c0,0-0.195-1.378-0.795-1.985c-0.76-0.797-1.613-0.801-2.004-0.847c-2.799-0.202-6.997-0.202-6.997-0.202 h-0.009c0,0-4.198,0-6.997,0.202C4.608,5.216,3.756,5.22,2.995,6.016C2.395,6.623,2.2,8.001,2.2,8.001S2,9.62,2,11.238v1.517 c0,1.618,0.2,3.237,0.2,3.237s0.195,1.378,0.795,1.985c0.761,0.797,1.76,0.771,2.205,0.855c1.6,0.153,6.8,0.201,6.8,0.201 s4.203-0.006,7.001-0.209c0.391-0.047,1.243-0.051,2.004-0.847c0.6-0.607,0.795-1.985,0.795-1.985s0.2-1.618,0.2-3.237v-1.517 C22,9.62,21.8,8.001,21.8,8.001z M9.935,14.594l-0.001-5.62l5.404,2.82L9.935,14.594z"></path></svg><span class="wp-block-social-link-label screen-reader-text">YouTube</span></a></li> <li style="color: var(--wp--custom--color--spindle); " class="wp-social-link wp-social-link-x has-spindle-color wp-block-social-link"><a rel="noopener nofollow" target="_blank" href="https://x.com/TDataScience" class="wp-block-social-link-anchor"><svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M13.982 10.622 20.54 3h-1.554l-5.693 6.618L8.745 3H3.5l6.876 10.007L3.5 21h1.554l6.012-6.989L15.868 21h5.245l-7.131-10.378Zm-2.128 2.474-.697-.997-5.543-7.93H8l4.474 6.4.697.996 5.815 8.318h-2.387l-4.745-6.787Z" /></svg><span class="wp-block-social-link-label screen-reader-text">X</span></a></li> <li style="color: var(--wp--custom--color--spindle); " class="wp-social-link wp-social-link-linkedin has-spindle-color wp-block-social-link"><a rel="noopener nofollow" target="_blank" href="https://www.linkedin.com/company/towards-data-science/?originalSubdomain=ca" class="wp-block-social-link-anchor"><svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M19.7,3H4.3C3.582,3,3,3.582,3,4.3v15.4C3,20.418,3.582,21,4.3,21h15.4c0.718,0,1.3-0.582,1.3-1.3V4.3 C21,3.582,20.418,3,19.7,3z M8.339,18.338H5.667v-8.59h2.672V18.338z M7.004,8.574c-0.857,0-1.549-0.694-1.549-1.548 c0-0.855,0.691-1.548,1.549-1.548c0.854,0,1.547,0.694,1.547,1.548C8.551,7.881,7.858,8.574,7.004,8.574z M18.339,18.338h-2.669 v-4.177c0-0.996-0.017-2.278-1.387-2.278c-1.389,0-1.601,1.086-1.601,2.206v4.249h-2.667v-8.59h2.559v1.174h0.037 c0.356-0.675,1.227-1.387,2.526-1.387c2.703,0,3.203,1.779,3.203,4.092V18.338z"></path></svg><span class="wp-block-social-link-label screen-reader-text">LinkedIn</span></a></li> <li style="color: var(--wp--custom--color--spindle); " class="wp-social-link wp-social-link-threads has-spindle-color wp-block-social-link"><a rel="noopener nofollow" target="_blank" href="https://www.threads.net/@towardsdatascience" class="wp-block-social-link-anchor"><svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M16.3 11.3c-.1 0-.2-.1-.2-.1-.1-2.6-1.5-4-3.9-4-1.4 0-2.6.6-3.3 1.7l1.3.9c.5-.8 1.4-1 2-1 .8 0 1.4.2 1.7.7.3.3.5.8.5 1.3-.7-.1-1.4-.2-2.2-.1-2.2.1-3.7 1.4-3.6 3.2 0 .9.5 1.7 1.3 2.2.7.4 1.5.6 2.4.6 1.2-.1 2.1-.5 2.7-1.3.5-.6.8-1.4.9-2.4.6.3 1 .8 1.2 1.3.4.9.4 2.4-.8 3.6-1.1 1.1-2.3 1.5-4.3 1.5-2.1 0-3.8-.7-4.8-2S5.7 14.3 5.7 12c0-2.3.5-4.1 1.5-5.4 1.1-1.3 2.7-2 4.8-2 2.2 0 3.8.7 4.9 2 .5.7.9 1.5 1.2 2.5l1.5-.4c-.3-1.2-.8-2.2-1.5-3.1-1.3-1.7-3.3-2.6-6-2.6-2.6 0-4.7.9-6 2.6C4.9 7.2 4.3 9.3 4.3 12s.6 4.8 1.9 6.4c1.4 1.7 3.4 2.6 6 2.6 2.3 0 4-.6 5.3-2 1.8-1.8 1.7-4 1.1-5.4-.4-.9-1.2-1.7-2.3-2.3zm-4 3.8c-1 .1-2-.4-2-1.3 0-.7.5-1.5 2.1-1.6h.5c.6 0 1.1.1 1.6.2-.2 2.3-1.3 2.7-2.2 2.7z"/></svg><span class="wp-block-social-link-label screen-reader-text">Threads</span></a></li> <li style="color: var(--wp--custom--color--spindle); " class="wp-social-link wp-social-link-bluesky has-spindle-color wp-block-social-link"><a rel="noopener nofollow" target="_blank" href="https://bsky.app/profile/towardsdatascience.com" class="wp-block-social-link-anchor"><svg width="24" height="24" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><path d="M6.3,4.2c2.3,1.7,4.8,5.3,5.7,7.2.9-1.9,3.4-5.4,5.7-7.2,1.7-1.3,4.3-2.2,4.3.9s-.4,5.2-.6,5.9c-.7,2.6-3.3,3.2-5.6,2.8,4,.7,5.1,3,2.9,5.3-5,5.2-6.7-2.8-6.7-2.8,0,0-1.7,8-6.7,2.8-2.2-2.3-1.2-4.6,2.9-5.3-2.3.4-4.9-.3-5.6-2.8-.2-.7-.6-5.3-.6-5.9,0-3.1,2.7-2.1,4.3-.9h0Z"></path></svg><span class="wp-block-social-link-label screen-reader-text">Bluesky</span></a></li></ul> </div> <div class="wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-1 wp-block-columns-is-layout-flex has-2-columns"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow"><div class="is-default-size wp-block-site-logo"><a href="https://towardsdatascience.com/" class="custom-logo-link" rel="home"><img loading="lazy" width="242" height="77" src="https://towardsdatascience.com/wp-content/uploads/2025/02/TDS-Vector-Logo.svg" class="custom-logo" alt="Towards Data Science" decoding="async" /></a></div> <p class="wp-block-paragraph">Your home for data science and Al. The world’s leading publication for data science, data analytics, data engineering, machine learning, and artificial intelligence professionals.</p> <div class="wp-block-group is-vertical is-content-justification-left is-nowrap is-layout-flex wp-container-core-group-is-layout-78 wp-block-group-is-layout-flex"> <div class="wp-block-tenup-copyright"> <span class="wp-block-tenup-copyright__copyright"> © </span> <span class="wp-block-tenup-copyright__prefix">Insight Media Group, LLC</span> <span class="wp-block-tenup-copyright__year"> 2025 </span> </div> <nav class="items-justified-center alignwide wp-block-navigation is-content-justification-center is-layout-flex wp-container-core-navigation-is-layout-1 wp-block-navigation-is-layout-flex" aria-label="Site Footer Navigation"><ul class="wp-block-navigation__container items-justified-center alignwide wp-block-navigation"><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://towardsdatascience.com/about-towards-data-science-d691af11cc2f/"><span class="wp-block-navigation-item__label">About</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://towardsdatascience.com/privacy-policy/"><span class="wp-block-navigation-item__label">Privacy Policy</span></a></li><li class=" wp-block-navigation-item wp-block-navigation-link"><a class="wp-block-navigation-item__content" href="https://towardsdatascience.com/website-terms-of-use/"><span class="wp-block-navigation-item__label">Terms of Use</span></a></li></ul></nav> <button id="ot-sdk-btn" class="ot-sdk-show-settings wp-block-html">Cookies Settings</button> </div> </div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow"> <h2 class="wp-block-heading has-surface-primary-color has-text-color has-link-color has-heading-6-font-size wp-elements-8abfba23580a95812086dc19dff05bae" style="margin-bottom:var(--wp--preset--spacing--16)">Sign up to our newsletter</h2> <script class="wp-block-html" charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script> <script> hbspt.forms.create({ portalId: "46095657", formId: "f73211c9-0317-43e8-8fbe-6eb475701286", onFormReady: function($form) { console.log({$form}); const formElement = $form[0]; console.log({formElement}); if (formElement) { const link = document.createElement('link'); link.rel = 'stylesheet'; link.href = 'https://towardsdatascience.com/wp-content/themes/tds-theme/dist/css/frontend.css'; formElement.ownerDocument.head.appendChild(link); } } }); </script> </div> </div> </div> </footer> </div> <script type="application/json" id="wp-script-module-data-@wordpress/interactivity"> {"config":{"tenup/site-header":{"debug":false,"navigationBreakpoint":900,"enableBackdrop":true,"enableHeadroom":false,"headroomOptions":{"offset":{"up":100,"down":100},"tolerance":0,"classes":{"initial":"headroom--initialized","pinned":"is-pinned","unpinned":"is-unpinned","top":"is-top","notTop":"not-top","bottom":"is-bottom","notBottom":"not-bottom"}},"focusableSelectors":["a[href]","input:not([disabled]):not([type=\"hidden\"]):not([aria-hidden])","select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","[contenteditable]","[tabindex]:not([tabindex^=\"-\"])"],"childRegions":[],"REGIONS":{"SEARCH":"search","MOBILE_NAVIGATION":"mobile-navigation"}},"tenup/navigation":{"icons":{"open":{"iconSet":"uikit","icon":"menu"},"close":{"iconSet":"uikit","icon":"close"}}},"tenup/search-button":{"icons":{"open":{"iconSet":"uikit","icon":"search"},"close":{"iconSet":"uikit","icon":"close"}}},"tenup/navigation-megamenu":{"icons":{"open":{"iconSet":"uikit","icon":"chevron-down"},"close":{"iconSet":"uikit","icon":"chevron-up"}}}},"state":{"tenup/site-header":{"isMobileNavigation":false,"isSubmenuExpanded":false,"isMobileNavigationExpanded":false,"isSearchExpanded":false,"hasSearch":false,"isInitialized":false,"expandedRegion":false,"triggerElement":null,"headroom":{"isPinned":false,"isTop":true,"isBottom":false},"isBackdropVisible":false,"isMegaMenuExpanded":false}}} </script> <script src="https://towardsdatascience.com/wp-content/themes/ui-kit-theme/dist/js/post-template-view-script.js?ver=a0d80fcdb9e0f5246681" id="ui-kit-theme-post-template-view-script-js"></script> <script id="wp-block-template-skip-link-js-after"> ( function() { var skipLinkTarget = document.querySelector( 'main' ), sibling, skipLinkTargetID, skipLink; // Early exit if a skip-link target can't be located. if ( ! skipLinkTarget ) { return; } /* * Get the site wrapper. * The skip-link will be injected in the beginning of it. */ sibling = document.querySelector( '.wp-site-blocks' ); // Early exit if the root element was not found. if ( ! sibling ) { return; } // Get the skip-link target's ID, and generate one if it doesn't exist. skipLinkTargetID = skipLinkTarget.id; if ( ! skipLinkTargetID ) { skipLinkTargetID = 'wp--skip-link--target'; skipLinkTarget.id = skipLinkTargetID; } // Create the skip link. skipLink = document.createElement( 'a' ); skipLink.classList.add( 'skip-link', 'screen-reader-text' ); skipLink.href = '#' + skipLinkTargetID; skipLink.innerHTML = 'Skip to content'; // Inject the skip link. sibling.parentElement.insertBefore( skipLink, sibling ); }() ); </script> <script id="tds-regwall-js-extra"> var tdsRegwall = {"ssoMetaApiEndpoint":"https:\/\/img-api.towardsdatascience.com\/api\/accounts\/sso\/meta?serverURL=https:\/\/img-api.towardsdatascience.com&redirect=https:\/\/towardsdatascience.com\/just-make-a-website-7c57f8f021c\/&failedRedirect=https:\/\/towardsdatascience.com\/just-make-a-website-7c57f8f021c\/","redirect":"https:\/\/towardsdatascience.com\/just-make-a-website-7c57f8f021c\/","ssoAccountEndpoint":"https:\/\/img-api.towardsdatascience.com\/api\/accounts\/me","ssoLogout":"https:\/\/img-api.towardsdatascience.com\/api\/accounts\/sso\/logout?redirect=https:\/\/towardsdatascience.com\/just-make-a-website-7c57f8f021c\/&failedRedirect=https:\/\/towardsdatascience.com\/just-make-a-website-7c57f8f021c\/"}; </script> <script src="https://towardsdatascience.com/wp-content/plugins/tds-plugin/dist/js/regwall.js?ver=2632e3dfc80e4aea6aab" id="tds-regwall-js" async data-wp-strategy="async"></script> </body> </html>