teleren/devto huggingface dataset:
Against Namespacing Personal Sites
Tags: reflections
Published: 2020-09-09 22:15:08

---
title: Against Namespacing Personal Sites
published: true
description: I care a lot about creating Cool URIs so I have been paralyzed more than I should be about what I'm calling "URL Architecture". In true fashion, I'm blogging about it.
tags: Reflections
slug: namespacing-sites
canonical_url: https://www.swyx.io/writing/namespacing-sites
---

I'm about to rewrite my personal site (for hopefully the last time for a long while). I have been paralyzed more than I should be about what I'm calling "URL Architecture". Because I care about [Cool URIs](https://www.w3.org/Provider/Style/URI), this is ideally not a reversible decision.

After some agonizing I think I have decided on a URL Architecture I like. In true fashion, I'm blogging about it.

"URL Architecture" (I don't know the proper word for this, if there is one pls correct me) is how you set up your URLs for each page of your site. For example, `netlify.com` has these:

- `netlify.com`: generic landing page
- `netlify.com/blog`: index of blogs
- `netlify.com/blog/year/month/day/slug`: individual posts
- other pages


I call that `/blog` a **namespace**. The reason you do this is simple: it GREATLY reduces the risk of clashing with any other page you could possibly put on your site. It is "future proof".

> Note: There is some debate about whether or not putting year/month/day in the URL impacts SEO. Some think it doesn't matter, some think it's a mild negative, some like it because you avoid clashes at the *slug* level.

Personal sites of frequent speakers often opt for TWO namespaces: `/writing` and `/speaking`. My current site (as of Sept 2020) uses this, but I have grown to dislike it: I will often speak about what I write, and write about related things I speak about. Why separate them? It is more effort to make my talks discoverable to my readers and vice versa.

The other thing that bothers me about my current setup is that it makes for ugly URLs. [My most popular essay ever](https://www.swyx.io/writing/learn-in-public) regularly gets linked to in Slacks, Discords, YouTube chats, Tweets and presentation slides. It weighs in at 43 characters all told.

If I shortened it to the shortcode that I set up for myself, `swyx.io/LIP`, it is only 11 characters. This looks much better.

I've noticed that a lot of prolific bloggers don't namespace:

- CSS Tricks: https://css-tricks.com/how-css-perspective-works/
- Derek Sivers: https://sive.rs/cons
- Paul Graham: http://www.paulgraham.com/good.html

These people have blogged for *decades* and somehow managed to find their way around possible URL clashes. Why can't I?
Terraform Debug Printing
Published: 2020-11-03 12:42:46

---
title: Terraform Debug Printing
published: true
date: 2020-09-09 21:38:00 UTC
tags: 
canonical_url: https://kevincox.ca/2020/09/09/terraform-debug/
---

<main><p>If you have ever had a value in <a href="https://www.terraform.io/">Terraform</a> that you didn’t quite know the shape of and get an error such as:</p>

<div><pre><code>This object does not have an attribute named "primary-ip".
</code></pre></div>
<p>You were probably <a href="https://github.com/hashicorp/terraform/issues/18315">frustrated</a> to <a href="https://www.reddit.com/r/Terraform/comments/c2z369/anyway_to_print_the_values/">find out</a> that Terraform doesn’t have a <code>print()</code> function.</p>

<p>Bugs have been closed with no resolution for this basic debugging essential. So I set out to find an “exploit” in Terraform that would let us see the value of a variable. My first thought, and what ended up being quite successful, was to find a <a href="https://www.terraform.io/docs/configuration/functions.html">function</a> that would show us the value on error.</p>

<p>After only a couple of tries I found that the <a href="https://www.terraform.io/docs/configuration/functions/file.html"><code>file()</code></a> function will print paths that it can not open. Unfortunately this doesn’t help if your value isn’t a string, so I paired it with <a href="https://www.terraform.io/docs/configuration/functions/yamlencode.html"><code>yamlencode()</code></a> to turn (most) values into a string.</p>

<p>And there we have it. Wrap <code>file(yamlencode(...))</code> around the value you want to see and hope that the file doesn’t exist.</p>

<div><pre><code><span>locals</span> <span>{</span>
	<span>foo</span> <span>=</span> <span>file</span><span>(</span><span>yamlencode</span><span>({</span><span>a</span><span>=</span><span>1</span><span>,</span> <span>b</span><span>=</span><span>2</span><span>}))</span>
<span>}</span>
</code></pre></div>
<div><pre><code>Invalid value for "path" parameter: a: 1
b: 2
</code></pre></div>
<p>It isn’t super pretty but it works. Let me know if you find something that works for a wider range of values, for my purposes <code>yamlencode()</code> was sufficient.</p>
Day 213: Soothing
Tags: hiphop, code, coding, lifelongdev
Published: 2020-09-09 21:33:18

_liner notes_:
- Professional : Whew, busy day! Got up early to work on my blog post and attend the first talk prep session, which was canceled, so I stayed working on my blog post. Got to talk with the Developer Education team about a project my team wants to start. Got some really good feedback. Sat in on the All Hands meeting where THE WHOLE COMPANY hears announcements from the Executive board and get to ask the board questions. Had lunch, then another talk prep session. This was a follow up talk so that we could see any of the changes and feedback given last week were integrated. Really good talk. It's on Blazor. Basically spent the rest of the day, working on my blog. I was going over a section and decided to create another example using a newer way so I spun up another Glitch project and talked about the code.

- Personal : I drove to a park to spend my work day and charge up my battery with my solar panels. (Can't wait to get solar panels mounted to the roof....Soon come!) It was a nice day so I took a walk around the park during lunch. I think I'll be doing that more. Also, realized that I still have my internet account live at my old place which gives me access to a network of hotspots around the country. So instead of using my phones' data plans I can just sign on. Been getting some really good speeds. I think my folks have the same internet provider so I'll be helping them out with their bill so I can use there account to sign in to hot spots since my physical address will be their place.

![A trail through a forest of huge Redwood Trees in Redwood State Park in California](https://dev-to-uploads.s3.amazonaws.com/i/5zak8yqhcxci4crh5puw.png)

It's raining now in the park and it's kind of cool to hear the rain hitting the roof while I code. Pretty soothing. Going to continue working on this blog post. Oh yeah, last night, I worked out a way to redirect a person to a specific page when they click "go back" on the event page of the side project I'm working on. If they go to the page directly, then they will be redirected to the home page, but if they get to the event page from either the upcoming or past events page, they will go back to the one they came from. Just had to think about how I wanted it to work and figure out how to get Sapper/Svelte to do it. Wasn't too bad to get it done. After the rain, if it's not too late, I'm going to stop by the market to pick up some things. Back to this blog.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube eCS4OTgaHeM %}
Day 20 of 100DaysOfCode
Tags: 100daysofcode, html, css, python
Published: 2020-09-09 21:24:19

#####Twitter bot update
Decided to rework some code for the Twitter bot and start really retweeting! So if you are interested in doggy pictures go follow [@HappyTweetBot1](https://twitter.com/HappyTweetBot1)! 

This has been a really fun project! Learned a lot about APIs and how to run scripts from servers and all kinds of good stuff! It was also pretty simple to start, and now I can measure the success using a number, the follower count. I know that might seem vain but it at least motivates me a little. 

#####Responsive Web Design Projects
Also decided to make progress on the Responsive Web Design Projects at FreeCodeCamp. I started them last December if I remember correctly and then they kind of fell off. The goal is to finish them and get my first FCC certificate!

Brushing up my HTML and CSS was fun and a little frustrating. Luckily Google is the programmer's best friend!

![Centering text meme](https://dev-to-uploads.s3.amazonaws.com/i/ggfw7i4oz88ynrd9w6dx.jpg)

#####Study plan
I decided to make a more robust schedule for coding. My base plan right now is:
1. Read a chapter of EJS in two days. Then do the exercises on the third day. 
2. Do at least ten challenges at FCC every day.

This is just the base plan and I'm adding some "spice" to the mix. The spice can be anything that I want to do on that particular day. 

I'll keep this at the beginning of my writings and change it as I see fit. 

I encourage everyone to make a plan. Winners make plans.

###What I did today:

####1. Improved my Twitter bot
https://twitter.com/HappyTweetBot1

####What I learned from it:
* Working with API
* Everyone likes doggy pictures :) 

####2. Continued Web Projects at FCC
https://www.freecodecamp.org/learn/responsive-web-design/responsive-web-design-projects/

####What I learned from it:
* Revised HTML and CSS
* Why Google is so great

####Time spent learning:
Task 'Twitter bot'. Elapsed time: 18 min 17 s
Task 'FCC responsive web design'. Elapsed time: 39 min 11 s

####Time actually coding: 45 min

#### Total time: 57 min 28 s
Time spent is tracked by my [TaskTimer](https://www.arttupyykonen.com/tasktimer/) script and the [WakaTime app](https://wakatime.com/about).

### Further reading

#### [Eloquent JavaScript book](https://eloquentjavascript.net/)
My favorite coding book. 

#### [FreeCodeCamp](https://www.freecodecamp.org/learn)
Check out FCC for the best interactive exercises! I have finished the Basic JavaScript, ES6, Regex, and Debugging lessons and can recommend them for a beginner

#### [Exercism coding challenges](https://exercism.io/)

###Psst
You can check my answers to the exercises of Eloquent JavaScript. You'll find them [here](https://www.arttupyykonen.com/ejs-solutions/).

Have a great day and see you all tomorrow!
How JavaScript Blocks work 🧱
Tags: javascript, webdev
Published: 2020-09-09 19:47:10

A block in JavaScript is used to group zero or more statements with curly braces (`{}`). Remember that a statement is simply a unit of code that does something or produces some behavior.

Blocks are most often used with `while`, `if...else` and `for` statements. We've all seen this, however, there is an interesting implication when using blocks with `let` and `const`.

In non-strict mode, functions and `var` variables do not have block scope:

```js
var foo = 'yo';
{
  var foo = 'hey';
}

console.log(foo); // Logs 'hey'
```

But when using `let` or `const`, blocks will hold the scope of each variable:
```js
let foo = 'yo';
{
  let foo = 'hey';
}

console.log(foo); // Logs 'yo'
```

```js
const foo = 'yo';
{
  const foo = 'hey';
}

console.log(foo); // Logs 'yo'
```

Note that no SyntaxError is thrown in the `const` example for a duplicate declaration. This is because the `foo` variable inside the block is contained within its own scope and thus does not conflict with the outer scope.

We use blocks so much in JavaScript that sometimes it's easy to forget their concept. They often seem attached to their adjacent code such as an `if` statement or function. But as we've seen in the example above, you can create perfectly valid code with your own isolated blocks if you want:
```js
{
  console.log('I run inside my very own block!');
}
```

Although this looks strange (almost as if you're creating an object on the fly), it's 100% valid. Blocks are fun! 🧱

----------
Check out more #JSBits at my blog, [jsbits-yo.com](http://jsbits-yo.com/). Or follow me on [Twitter](https://twitter.com/JS_Bits_Bill)!
Building a bubble heart counter in React using Framer Motion
Tags: react, javascript, showdev
Published: 2020-09-09 21:06:18

I started off wanting to write an extensive step-by-step tutorial on how to build a bubble heart counter. But, [Framer Motion](https://www.framer.com/api/motion/) turned out to be so simple that I decided to just post my code below. Hit me up [@SharathPrabhal](https://twitter.com/SharathPrabhal) if you have any questions or want me to write a post on other animations patterns.

```
function HeartComponent() {
  const [floatingHearts, setFloatingHearts] = useState<JSX.Element[]>([]);
  return (
    <motion.div
      className="relative rounded-full text-5xl inline-block p-2 cursor-pointer"
      onClick={() => {
        setFloatingHearts([
          ...floatingHearts,
          <motion.div
            key={floatingHearts.length}
            className="absolute top-0 z-50"
            animate={{
              y: -150,
              opacity: 0,
              scale: 1.75,
              x: [0, randomNumber(-150, 150)],
            }}
            transition={{ duration: 2 }}
          >
            <HeartFilledIcon
              style={{
                color: randomColor({
                  luminosity: 'bright',
                }),
              }}
            />
          </motion.div>,
        ]);
      }}
    >
      <HeartIcon />
      {floatingHearts}
    </motion.div>
  );
}
```
Little Timers Everywhere
Tags: webdev, javascript, tutorial, azure
Published: 2020-09-09 20:48:39

#### 📺 017 - Jasmine Greenaway 🎙️ Jason Hand

{% youtube OuE401B2xWM %}

We'll make a little Pomodoro timer. Should it be a VSCode extension? A browser extension? Cross platform app? Should we hook it up to an IoT device too? Let's see what we can come up with!

---

### Useful Links

🔗 [Azure IoT Hub](https://cda.ms/1tm)

🔗 [Visual Code Studio](https://cda.ms/1tn)

🔗 [Edge and Chromium Extensions](https://cda.ms/1tp)

🔗 [Azure IoT Developer Kit](https://cda.ms/1tq)

🔗 [VS Code Extension - IoT Workbench](https://marketplace.visualstudio.com/items?itemName=vsciot-vscode.vscode-iot-workbench)

🔗 [Build Javascript Applications with Node.js](https://cda.ms/1tr)

🔗 [Introduction to Azure IoT](https://cda.ms/1tt)

🔗 [Adaptive Cards](https://cda.ms/1tk)

---

### Learn more on Jasmine Greenaway

🔗 [@Paladique](https://twitter.com/paladique)

🔗 [Bio](https://developer.microsoft.com/en-us/advocates/jasmine-greenaway)

☁️
HTML not a programming Langauge!!?
Tags: html, functional, 100daysofcode
Published: 2020-09-09 20:37:57

As a beginner Just started to learn HTML and CSS, proud of your self that you start your first steps in Programming's long way, I think you almost heard that "HTML is not a programming Langauge"!!
Ok, I agree with that if we consider that programming languages are only who have functionality in them because you can't do any functions with HTML.
But especially when we are talking about websites, Apps, and so, on,  you will find that the "HTML" is the code that give life for other programming languages. Without it, you can't build the content and use your functions in your interface. 
So enjoy studying HTML and CSS, and have fun using them :), they are valuable.
Golang Q & A Doc.
Tags: beginners, go, tutorial, career
Published: 2020-09-09 20:34:56

When we learn new programming language many questions pop into our mind, like why some of the features which are already available in other languages are not available in the new language we are learning? Right now I am in the same phase since I am learning _golang_. Google have done great job at documenting those questions in the form of Q & A.

[Golang FAQ](https://golang.org/doc/faq#internal_usage)

What are other documentations/articles you found helpful while learning golang ?
Collaborative writing?
Tags: discuss, meta
Published: 2020-09-09 19:19:38

It's more of a suggestion for a new feature than discussion but:

Would it be useful to have collaboration on a post like having 2 people write same article? It's not super complicated feature just like having someone invite others to edit their post before publishing. If post is edited by 1 user other should not be able to edit until first person is done. And both authors are shown in the list. Could be more than 2 people could be expanded to blocking only parts for editing, or collaboration on series... 

Do you know any platform with similar goal as Dev.to that implements this?
How to store a function using React.useState
Tags: javascript, react, hooks, usestate
Published: 2020-09-09 19:06:50

Sometimes things that have seen too easy to accomplish fail silently. Recently I have faced with such issue when I try to store a function in a React component to use it later. In this post, I have tried to explain my situation an its solution.

I was refactoring an old class-based React component into a functional one. I have tried to use `useState` hook as it usually happens. But it this case I was trying to store a function.

```react
import React, { useState } from "react";

const MyComponent = (props) => {
  const [myFunc, setMyFunc] = useState();

  const handleClick = () => {
    const callback = props.someFunctionCall();
    setMyFunc(callback);
  };

  return (
    <button type="button" onClick={handleClick}>
      A button
    </button>
  );
};
```

Things seem alright at first glimpse. However when I run it, I found out that the callback function was invoked immediately.

# Why?
The code seems straightforward enough. But it took a couple of minutes to realize my mistake. It is because update function of `useState` accepts either a value or a function to return a value:

```typescript
type SetStateAction<S> = S | ((prevState: S) => S);
```

That's why when I passed a function to `setMyFunc`, React tried to get the return value of `callback` function by passing `prevState` to it as an argument.

# Solution
Once you realize the problem, it is easier to solve. All we need is an arrow function to wrap our actual `callback` function:

```javascript
setMyFunc(() => callback);
```

By doing that, we give React a function to get our `callback` function and set it properly.

You can refer to [React's Hooks API Reference](https://reactjs.org/docs/hooks-reference.html#functional-updates) to find more info about it.
Responding to Mr. Hastings  statements about WFH
Tags: productivity, remote, leadership
Published: 2020-09-09 18:57:37

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/59ydloijfzsystx4pae0.jpg)

Imagine a world like ours suffering a pandemic but there are no streaming services. The movie theaters shut down and people are forced to watch entertainment from the internet in any way they can cobble together.

Now along comes someone and says watching from home is "[a pure negative](https://archive.is/6iK6Z)".

Mr. Hastings says, "Debating ideas is harder now." just as in that alternate no streaming services world someone might say, "full immersion in the entertainment is harder now."

Of course without streaming services one would have no concept of binge watching and so watching from home would have less upside. Just as in a world where working from home tools like [Uclusion](https://www.uclusion.com) are unknown it might seem that asynchronous collaboration is very difficult.

Early on in any technological change skeptics can poke fun. The real surprise is a visionary like Hastings having so little vision on this subject:

> If I had to guess, the five-day workweek will become four days in the office while one day is virtual from home. I’d bet that’s where a lot of companies end up.

Why not four days virtual from home and one day in the office? If WFH is such a negative why would people want the one day from home? America is very early on in this experiment and already working remotely is working much, much better than predicted. As new technology built for asynchronous collaboration becomes more wide spread the case for a high percentage of time in the office will only decrease.
The 4th step in TDD
Tags: tdd, testing, productivity, programming
Published: 2020-09-09 18:47:05

If you are doing TDD or not, your daily work is combined from a few repetitive actions. Each one has its own “methodology”, even if he is not aware of.

Yesterday I have been working on a bug from production. I created a test reproducing the bug, meaning I had a failing test — the 1st step in TDD.

While working, I found myself thinking about a lot of things in the same time: refactoring, trying to understand the existing code, how I make my test pass without breaking the others, how my tests should look like and so on.

**I got into a SWIRL.**

![SWIRL IMAGE](https://dev-to-uploads.s3.amazonaws.com/i/ov8p7s3j2q3xd2ljvc2q.jpg)

<figcaption>
<span>Photo by <a href="https://unsplash.com/@cassidykelley?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Cassidy Kelley</a> on <a href="https://unsplash.com/?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>
</figcaption>

When I noticed that, I stopped and said to myself ”Shani, one of the reasons you like TDD is because it makes you focus better. Currently, you are not focused at all”.

So I decided to focus on **just making my test pass**, ignoring that others will fail. And on that occasion make sure they do fail.

If you think about this, I split TDD 2nd step into two:

1. Make my test pass

2. Make all the previous tests pass

Why I did this?  Because I noticed thinking about those two together was mentally too much for me. (The number of objects an average human can hold in working memory is [7 ± 2](https://en.wikipedia.org/wiki/The_Magical_Number_Seven,_Plus_or_Minus_Two), I think for me is just 1 😅)

So here it is, after a search for the relevant entry point for my code, **I added one line with hard-coded values relevant only for my test**. Happily, Now some tests are red, time for the hard part: making it all work again.

![FOREST IMAGE](https://cdn-images-1.medium.com/max/2000/1*eXLAX8mIOl0uqTRza8AJ9g.png)
<figcaption>
start from a failing test and then make <B>only</B> my test pass
</figcaption>

If my changes didn’t cause any tests to fail, it means I didn’t have tests testing different scenarios that were affected by my change (besides the bug scenario). Since I added one line with hard-coded values it probably should break some tests. If that was the case I should have added some green tests before I changed the code in order to catch regressions.

Would love to hear your thoughts and about your personal methodologies.
Day 55: Working with google maps api.
Tags: 100daysofcode
Published: 2020-09-09 18:41:30

Made some progress with the web app. I used the documentation to come up with an auto complete search bar for the webapp. It's working but i kinda have to pay for it to get actual data. Since I'm merely experimenting i had to find an alternative. I landed on [Rapid Api](https://rapidapi.com/) it is market place for API's. 

I'm yet to try out any of them but I'll do so tommorow. Deadlines are on my neck 😂 and all i want to do is vanish. 

_Day 55_
Any domain migration checklists?
Published: 2020-09-09 18:41:11

I'm planning to migrate domains (switching from the github.io domain to my own), and I'm wondering what tips, pitfalls and checklists y'all have for migrating between domains.

Currently, I'm planning to just have the github.io domain redirect to my new one, so if people stumble on the old link ~~or I forget to change it somewhere~~ they'll still get to my actual site.

Also, if you have any places where I might forget to change my website link - please comment!