teleren/devto huggingface dataset:
When did time get so complex?
Published: 2021-05-14 23:05:27

So, like all normal people, I hated math in high school.  (Just kidding, I know somebody somewhere liked math.  I just never knew them.)  So when I started learning about Big O and time and space complexity it all seemed WAAAY to complex for me to understand.  I vaguely remember words like logrithmic and factorial from years ago but I couldn't have begun to explain what they all meant.

Fortunately, there are lots of people who are way smarter than me who also are really good at teaching!  I have now spent hours watching videos and solving problems and I can safely say that I'm starting to understand it!  Shout out to smart, patient people!

Really, when it comes down to it, time complexity in most cases (that I've gotten through, I'm sure it gets far more complex) is just a matter of counting.  How many things are you asking your function or program or whatnot to do?  If it is just making a variable and that's it - woohoo, that's constant!  If you are looping through an array, that's going to take as long as the array length, right?  So that would be called linear or O(n) if n is the number of items you are looping through.

Now that's really way oversimplifying everything.  There are obviously complexities that come with all of that and nothing is ever that simple, but it really does help to think about it in simple terms - break it down first.  Sometimes that's the best and only way to solve a problem, make it smaller more manageable problems.  Figuring out how to always spot two time complexities makes finding the rest that much easier.

Now I'm on to those more mathy terms like logrithmic ( O(log n) ) and polynomial ( O(n^2) ).  But now that I've started learning this stuff, I know I can pick up the rest no problem.  Just gotta keep breaking it down until it all makes a little more sense!

R
Video: How to Update Google Sheets with Data From an External API
Tags: nocode, tutorial, video
Published: 2021-05-28 21:50:43

---
title: Video: How to Update Google Sheets with Data From an External API
published: true
date: 2021-05-14 22:15:08 UTC
tags: NoCode,Tutorial,Video,tutorial
canonical_url: https://maxkatz.org/2021/05/14/video-how-to-update-google-sheets-with-data-from-an-external-api/
---

In this video you will learn how to update a Google Sheets spreadsheet with data from an external API.

I’m using the following no-code tools to build this automation:

- [News API](http://newsapi.org/) – locates news from news sources and blogs with JSON API. We will use data from this API to update Google Sheets
- [Parabola](http://parabola.io/) – automation and integration platform. Parabola has a free plan. Every new account comes with a 14-day Premium account which allows flow scheduling
- [Google Sheets](https://docs.google.com/spreadsheet/) – an online spreadsheet that will be used as database

{% youtube KU9MB31ZM0c %}

Learn about other no-code tools and automations by [watching videos from this playlist](https://www.youtube.com/watch?v=KU9MB31ZM0c&list=PLSAWywyhniCOpvlFSfUWVNAbclc2-1Kne).
The Best Options For Mobile App Development
Tags: android
Published: 2021-05-14 22:00:59

Mobile app development can be categorized into native apps, web-based mobile apps, and hybrid apps. 

Native apps are compiled binaries designed for the device they run on. They are the fastest and safest. Web applications run in the browser and require an Internet  connection. Web apps are the slowest, with the least access to the device features. Hybrid applications are a bit of both, part native, part web app, and are often found in many low-code solutions.

You can [read this nice article here](https://blogs.embarcadero.com/what-are-the-best-options-for-mobile-app-development/?utm_source=DevTo&utm_medium=AffiliateOutreach&utm_content=what-are-the-best-options-for-mobile-app-development%2F) to learn more.
Whats an Interface?
Tags: csharp, webdev, dotnet
Published: 2021-05-14 21:59:43

Interfaces can be confusing for beginner programmers, but I think I have the right analogy to explain them in simple terms.

Imagine with me for a moment, that you were born into a wealthy family, so wealthy that you need not do very much for yourself, and especially not be bothered with transportation.  You even hired the best chauffeur that can handle any vehicle.

The only thing required of you is selecting a vehicle, everything else will be taken care of.  If you're to be transported somewhere, you'll need that vehicle to have at least 3 functionalities:

1. A place for the driver or operator.
2. A place for you to sit.
3. some way to move.

There are obviously other things, but they don't concern you.  You just need the basics.  Does a car fit this description?  Yes of course, you have both seats, and it can travel along a road or path.  Does a commercial airplane fit the description?  Yes again, even though there might be extra seats, it can take you somewhere. even though it does it differently than a car would. A bench would not satisfy the requirements, even though it has 2 seats, it goes nowhere.  

This is what an interface calls for, an object that can do certain things.  It doesn't care how they get done, as long as the user (or the controller in an MVC app) says "GO" it knows it can go.  

Just a quick analogy today.  Have a great weekend everybody!
Day 367 : Design Flaw
Tags: hiphop, code, coding, lifelongdev
Published: 2021-05-14 21:59:35

_liner notes_:
- Professional : Had a really good day. Had my team meeting, then worked on putting the finishing touches on a video. I recorded all the voice overs and matched them to the video. I'm just going through and make sure the videos line up with what I'm saying. So extending some parts and shortening others. My laptop is taking a while to edit the videos.

- Personal : Went through tracks for the radio show and I think that was it. I went to be early so I could get up early and record the voice overs when it was as quiet as it would probably get. 

![View into a valley of a town in Meteora, Greece surrounded my large land masses with mountains in the distance](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r1l8en3rdlkvlibkchki.jpg)

Going to finish putting together the radio show for tomorrow. Then work on my side project and finish watching Season 1 of "Yasuke". I'll probably also work on the framing of the inside of my van. Just got a couple of more pieces delivered that may fix a little design flaw in my original plan. Hopefully I can get some work done to it this weekend. We'll see.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube GYRr31o7Ws0 %}
How to use Bootswatch Themes with Reactstrap
Tags: javascript, react, frontend
Published: 2021-05-14 21:53:57

Sometimes we don't have a design system in our hands or we simply want to get a project online as quickly as possible. And for others coding in CSS is not their strong suit. I think all the programmers have already used or at least heard about [Bootstrap](https://getbootstrap.com/) so I am not going to talk about what this specific framework is. Especially because I will explain how to use one of the most popular UI Libraries in the React.js universe and how we can make it more appealing.

If you've heard of Bootstrap, then you should already know what the [Bootswatch](https://bootswatch.com/) project is. For those who do not know, it is simply a collection of free themes for Boostrap. But what a lot of people don't know is that we can combine [reactstrap](https://reactstrap.github.io/) with bootswatch and have fully functional JavaScript components with a totally different design than what we are used to.

## How to setup

The configuration is simple, just paste this command in the terminal:
```bash
npm install reactstrap bootswatch
```

And in the **index.js** file, paste the following line of code:
```js
import 'bootswatch/dist/quartz/bootstrap.min.css';
```

In this case I am using a theme called [Quartz](https://bootswatch.com/quartz/), after that all components are customized. But you can choose many other themes without having to install a third dependency, just change the name of the theme. Make sure you have saved all the files and then visit your website, if you don't see any differences, do a simple refresh.

## What about you ? 

What is your favorite Bootswatch theme?
How to improve your clicking speed?
Tags: cpstest, cpstester, cpscounter, clicktest
Published: 2021-05-14 21:53:15

Well in order to improve your clicking speed first you have to measure your clicking speed. So first thing first, go to <a href="www.cpstest.us">CPS Counter</a>
 to analyze your mouse and spacebar clicking speed. There are multiple tools with several time durations in order to get your desired job done.
Open any analyzer tool with any time duration, 5 seconds test and 10 seconds are most commonly used and loved by thousand of gamers to test their mouse button click speed.
Click on start button to start your [click speed test](https://cpstest.info/), upon timer starts, start pressing the button as fast as you can until the time runs out. A new window will be popped up containing your click score results, after timer stopped. There would be two types of result shall be shown, 1: total number of clicks you have performed. 2: your average clicking speeds with proportionate to clicks per second (which is calculated by total number of clicks divided by total number of seconds i.e. your selected time duration for that particular test).
In order to improve your clicking speed, all you need is to practice more and more with these provided tools using different time intervals.
Just give it a try while having fun.
Cheerssssssssssssss……
LeetCode 1482. Minimum Number of Days to Make m Bouquets (javascript solution)

Tags: algorithms, javascript
Published: 2021-05-14 21:44:15

###Description:
Given an integer array bloomDay, an integer m and an integer k.

We need to make m bouquets. To make a bouquet, you need to use k adjacent flowers from the garden.

The garden consists of n flowers, the ith flower will bloom in the bloomDay[i] and then can be used in exactly one bouquet.

Return the minimum number of days you need to wait to be able to make m bouquets from the garden. If it is impossible to make m bouquets return -1.

###Solution:
Time Complexity : O(nlog(n))
Space Complexity: O(1)

```javascript
// Binary Search
var minDays = function(bloomDay, m, k) {
    // Check if we can make m bouquets given in day days
    function checkCondition(day) {
        let bouq = 0
        let flowers = 0
        for(const bloom of bloomDay) {
            if(day >= bloom) flowers++
            else flowers = 0
            if(flowers===k) {
                bouq++
                flowers=0
            }
        }
        // If we can make m or more bouquets, check if we can do it faster
        return bouq >= m 
    }
    
    // It is impossible to make m bouquets if we don't have enough flowers
    if(m * k > bloomDay.length) return -1
    // The fastest we can make a bouquet is the min of bloomDay and the slowest we can make a bouquet is the max of bloomDay
    let left = Math.min(...bloomDay), right = Math.max(...bloomDay)
    
    // Binary search template
    while(left < right) {
        const mid = left + Math.floor((right-left)/2)
        if(checkCondition(mid)) {
            right = mid
        } else {
            left = mid + 1
        }
    }
    return left
};
```
Run Node.js app with ES6 features
Tags: node, es6, babel, babelnode
Published: 2021-05-14 21:43:55

In this article, we will learn how to use ES6 syntax to write your **Node Server** in few simple steps.

##	Installing babel as dev dependencies in the project

> Babel is a toolchain that is mainly used to convert ECMAScript 2015+
> code into a backward-compatible version of JavaScript in current and
> older browsers or environments. Here are the main things Babel can do
> for you:
> 
> -   Transform syntax
> -   Polyfill features that are missing in your target environment (through a third-party polyfill such as
> [core-js](https://github.com/zloirock/core-js))
> -   Source code transformations (codemods)
> -   And more! (check out these [videos](https://babeljs.io/videos.html) for inspiration)

**Installation with npm**

    npm install --save-dev @babel/core @babel/node @babel/preset-env
   **Installation with yarn**

    yarn add @babel/core @babel/node @babel/preset-env -D

After successful installations of dev-dependencies create a file named **.babelrc** like this. 

![.babelrc-file](https://i.ibb.co/SXNjpYV/Screenshot-2021-05-15-at-2-23-46-AM.png)
and paste the following code in it and save the .babelrc file.

    {
	    "presets":  ["@babel/preset-env"]
    }

## Running the ES6 Code
Now you can run your node.js project with ES6 features by running the following command.

    yarn babel-node index.js
    or
    npx babel-node index.js



That is it for this short article. 

I am writing this first time please forgive me for my mistakes. I hope you guys find it informative.
My journey to coding
Tags: newbie, beginners, codenewbie, webdev
Published: 2021-05-14 21:25:12

I consider myself new to coding world. Being accepted into Code Your Future (CYF) community is best thing ever happen to me, having being in limbo and stateless in the UK for many years, through no fault of my own.

The CYF lessons are very compact, concise and challenging. There are plenty of support from tech experts and from CYF. It is delightful to meet and get to know my fellow trainees and tech experts who come from different walks of life.

The programming languages I learn to date: HTML, CSS, JavaScript, React, Node, Bash, how to use GitHub, Heroku, Netlify, Postman, and will be learning PostgreSQL soon.

I find there are similarity in different languages, that is computer works on logic, with different syntax. Being a programmer, is a problem solver. We need to think a lot and try to break down difficult question into smaller parts.

Like any job/career out there, as a programmer who need to well verse in the programming language used,  communication, teamwork, collaboration, professionalism are skills equally important in order to be a good and successful programmer.

Thank you for reading.

Check out my:
GitHub - https://github.com/liewteh
LinkedIn - https://www.linkedin.com/in/liew-teh/
Twitter - https://twitter.com/StatelessnessUK
Python Madlibs Clone Tutorial
Tags: python, programming, tutorial
Published: 2021-05-14 20:45:43

# Making Our Own Version Of Madlibs
We're going to [recreate the classic word fun of Madlibs](https://www.iceorfire.com/post/python-madlibs-tutorial) using built-in Python libraries and an awesome library called Inflect. I [covered Inflect in another post](https://dev.to/iceorfiresite/four-useful-python-libraries-you-don-t-know-about-4lhl).

# Support Me
If you find these tutorials helpful, please consider [buying me a coffee](https://www.buymeacoffee.com/z4F8QVS6w). Thanks!
Spruce up Link Tags with  Retrieved Favicons 
Tags: html, javascript
Published: 2021-05-14 20:38:37

So everybody loves [links]('www.dev.to') right? They take us to places we want to go. 

Who wouldn't like them!

But they can be boring.🥱💤 

Sure you can style them  or manually get an image to show what the site is but why not get the websites own logo by using the Favicon from the link site and display it as well _using the same url as the link_? This would be pretty handy if we were creating links dynamically from a list eg [link1,link2,link3]  ...

#####What is a Favicon anyway ? 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/urut05xes9nd86x6jj5k.png)
The favicon is a small typically 16×16 pixel icon that serves as branding for websites. It is found in browser tab and within the browser address bar. 
TLDR Its a tiny site logo.

#####Our Example
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bhr5nux949r0gjp1d3ou.png)
We'll create a sample using a hardcoded value - 'https://dev.to/', but you can iterate over list of urls if you want. The only difference will be that you will be injecting the link. 

We need to create two elements within the `a` tag - one for the image , the other for the link text. You can see the HTML needed below.

```html
 <a  class="link-item" href="https://dev.to/" > 
       <span class="link-image">
             <img src=""  width="25" height="25" />
       </span> 
       <span class="link-text">
               www.dev.to
       </span>
</a>
```

For the image source we can try two things:
1.Set the source as 'https://dev.to/favicon.ico' - the favicon can typically be found at the site root.
2.We can use Googleusercontent.com, which is a site that Google is using for a few things ,including storing website favicons visited by the search engine. Just use this as the source, set the domain value with the website url  'https://s2.googleusercontent.com/s2/favicons?domain=www.dev.to'  

Either of these options are fine , but we could combine them using one as a fallback if the other fails using the javascript onerror event.

We can do that with the below:
```html
<img src="https://dev.to/favicon.ico" 
     onerror="this.onerror=null; this.src='https://s2.googleusercontent.com/s2/favicons?domain=www.dev.to'" 
     alt="Dev.to" width="25" height="25"
/>
```

The purpose of adding `this.onerror=null;` within the onerror event is to prevent an endless loop of errors if both fail. 

That's it , its pretty simple !! Go congratulate yourself because your links look better already 🎉🎉

You can see a JSFiddle demo [here](https://jsfiddle.net/j_mc_falcon_19/hao8rsyk/3) 


And if you're feeling generous you can buy me a coffee with the link below ( and yes its all for coffee,  I drink a copius amount of it while writing ☕ )  


[![Buy Me A Coffee](https://cdn.buymeacoffee.com/buttons/default-black.png)](https://www.buymeacoffee.com/SUKaQp9)
React Developer Remote Position 
Tags: hiring
Published: 2021-05-14 20:33:30

Fortune 500 oil & gas company in Houston is opening up the opportunity to Full-Stack developers across the country after allowing their IT team to go permanently remote.

Full-Stack Software Developer
This position is an ongoing contract, renewed every 6 months.

Technologies: React, React Hooks, Redux, Node, GraphQL, API
Back-end experience- MongoDB, NoSQL, data-driven projects

Description
Build in-house applications in Web ASP.NET. Develop applications in React and change the front end.

Required knowledge
-Libraries
-Code quality
-Life cycle hooks in React
-API
-Data-heavy projects

About the company
Fortune 500 oil & gas company HQ'd in Houston. Named one of the "Top Workplaces of 2018 & 2019" in Houston Chronicle and other Texas publications.

How to apply:
Please email resumes to Kasey.Wickens@OdysseyIS.com


_Please feel free to leave questions in the comments section._
Fix TinyMCE-React not usable in Material-UI Dialog
Tags: materialui, react, tinymce
Published: 2021-05-14 20:23:02

The TinyMCE editor rendered in Material-Ui Dialog doesn't work as expected. For example, TinyMCE Dialog component fields are not selectable; the table and link plugin doesn't work etc. 

All of these just because TinyMCE is having problems to focus things.

The fix is very simple: disable Material UI Dialog's enforce focus by adding a prop `disableEnforceFocus={true}` and optionally `disableAutoFocus={ true}`
Explain it like I'm 5: new build tools
Tags: javascript, discuss
Published: 2021-05-14 20:22:08

I have a list of several new tools I keep hearing about but I have no idea how they fit into the ecosystem, what they do or what they are trying to replace:

**Snowpack**
**Rollup**
**Vite**

If you work with one of these I'd love if you could explain it to me like I'm 5.

For context: I work with Yarn as a **package manager** and I've occasionally worked on projects where assets were compiled with Gulp (build tool?).  Most projects I work with are using Webpack (build tool?) in some way or another but I almost never configure it in anyway.
Asynchronous Programming
Tags: programming, beginners, csharp
Published: 2021-05-14 20:04:09



As much as we all love computers they can be very difficult to deal with. Especially as Developers. One of the most crucial aspects of building an application is making sure that it runs in a timely manner. Even the most complex algorithm is no good if it takes 5 hours to run. This problem typically arises when the code is written in a way where it executes block-by-block. This is where *Asynchronous Programming* can save the day.

*Asynchronous Programming* is basically a form of parallel programming that allows a block of code to execute on its own separate from the main application thread. Once the block of asynchronous code is complete it will notify the main thread. Now let’s put this logic into an example all of us can understand.

The next time you cook breakfast try to make everything individually. For example if you wanted to make scrambled eggs, sausage, toast and a cup of juice you would have to make the eggs first but you can’t work on other components of your breakfast. So now that the eggs are complete you can finally begin frying the sausages. Let’s say that sausages take 10 minutes. That means that within those 10 minutes you can’t simply put the bread in the toaster to get your toast. As you can see this can end up being very time consuming.

With *Asynchronous Programming* the workflow of executing code or making breakfast saves a lot of time and headache for the user. Now that we are operating asynchronously let’s take a look at the process.

1. Warm the pan for eggs.
2. Warm another pan for sausages.
3. Depending on which pan warms up first, put the respected item in the pan.
4. Cook eggs.
5. Flip sausage.
6. Put bread in a toaster.
7. Flip sausage.
8. Put jelly on toast.
9. Put eggs, sausage, and toast on a plate.
10. Pour juice.

Making breakfast asynchronously will save you about half the time and trouble compared to performing in a synchronous manner. In my next article I will explain how to implement this concept into lines of code while using the Await and Async keywords so keep on the lookout for part 2!
Live Dev: How to set up a Node project with Typescript
Published: 2021-05-14 20:01:24

Learning how to code is a long process. Structured coursework and tutorials are a great way for most people to learn, especially at the beginning, but at some point you start to wonder... what does the *actual work* of development look like? How do you go from identifying a problem to a deployable project that *solves* that problem?

I had a (relatively) small side project I wanted to tackle for fun, and decided to do it live on video so that people could see the whole process from start to finish.

If you:

+ Love the Node/JavaScript/Typescript ecosystem and want to get *real deep* into how it all works together; or
+ Are having trouble using your programming knowledge to build full solutions; or
+ Are actively developing your fluency in programming in general or JavaScript/Node/Typescript in specific; or
+ Enjoy the calming background sounds of someone talking about nerd stuff

... then this will be right up your alley!

In Episode 1 I go through the process of setting up a new Node + Typescript project and present the problem being solved: converting Git logs into changelogs/patchnotes.

{% youtube OMCAAcfWLD4 %}

If you want to joint the next one live to ask questions or tell me when I'm wrong, [subscribe on Twitch](https://twitch.tv/bscotch) and/or [follow me on Twitter](https://twitter.com/costerad).