teleren/devto huggingface dataset:
Console Games - Snake - Part 1
Tags: gamedev, csharp
Published: 2019-10-08 07:10:19

This continues on from a series on writing a game in a C# console application; the original post can be found <a href="https://www.pmichaels.net/2014/11/23/console-games-snake-part-1/">here</a>.

Based on <a href="http://pmichaels.net/2014/11/11/writing-a-game-in-a-console-application-teaching-programming/">this</a> earlier post, we had a working console game.  Admittedly it doesn't do much, apart from allow you to move a star around the screen.  In order to turn this into a snake game, the first thing to do is to no longer clear the screen:

```csharp
        private static void DrawScreen()
        {
            //Console.Clear();
            Console.SetCursorPosition(_left, _top);
            Console.Write('*');            
        }

```


That gives us a snake - but you might notice that when you move left, it doesn't 'trail'.  There is a possible workaround (albeit, not massively efficient - although remember that this is a game with the purpose of teaching programming).

First, create a struct to hold the position:

```csharp
        private struct Position
        {
            public int left;
            public int top;
        }
```

This obviously could be a class.  Next, create a list of these:

```csharp
        private static List<Position> points = new List<Position>();
```

Here's what the `AcceptInput` function looks like with the changes:

```csharp
        private static bool AcceptInput()
        {
            if (!Console.KeyAvailable)
                return false;

            ConsoleKeyInfo key = Console.ReadKey();

            Position currentPos;
            if (points.Count != 0)
                currentPos = points.Last();
            else
                currentPos = GetStartPosition();

            switch (key.Key)
            {
                case ConsoleKey.LeftArrow:
                    currentPos.left--;
                    break;
                case ConsoleKey.RightArrow:
                    currentPos.left++;
                    break;
                case ConsoleKey.UpArrow:
                    currentPos.top--;
                    break;
                case ConsoleKey.DownArrow:
                    currentPos.top++;
                    break;

            }

            points.Add(currentPos);

            return true;
        }

        private static Position GetStartPosition()
        {
            return new Position()
            {
                left = 0,
                top = 0
            };
        }
```

<strong>But what about the tail</strong>

In traditional snake, the last element is removed each iteration, unless you `eat` something.  Doing it the above way lends itself to this more easily.  I'll tackle that for the next post.
How to add “latest” post redirect to Jekyll site
Tags: programming, web, jekyll, ruby
Published: 2019-10-14 07:29:47

---
title: How to add “latest” post redirect to Jekyll site
published: true
date: 2019-10-08 06:30:00 UTC
tags: programming, web, jekyll, ruby
canonical_url: https://varunbarad.com/programming/web/2019/10/08/how-to-add-latest-post-redirect-to-jekyll-site.html
---

I wanted to have a URL which I can give to someone and it would always take them to the latest post published on my blog. I ended up using (https://varunbarad.com/blog/latest)[vb-blog-latest](https://varunbarad.com/blog/latest) as the URL.

Since my website is statically generated and hosted, it wasn’t an option for me to specify a server-side `30x` redirect for that particular URL to my latest post.

So what I ended up doing is generate a page on each build which would redirect user to the latest post using JS. To get the information about latest post, I made use of Jekyll’s Liquid templating _syntax_ (not sure what else to call it).

So the `<body>` tag of that page ended up looking like this:

```html
<body>
{%- assign latest_post = site.posts[0] -%}
<p>Redirecting you to {{ latest_post.title }}</p>

<script>
    window.location.href = "{{ latest_post.url }}";
</script>

</body>

```

Here I get the details of latest post by taking the first post in the list `site.posts`. AFAIK `site.posts` is sorted in descending order by publishing date, so this approach fetches me the last published post.

Then it is a simple matter of setting the `window.location.href` to the final url of the latest post.

The final task remaining was to make sure that this page was compiled and generated exactly at `https://varunbarad.com/blog/latest`. For that I specified a `permalink: "/blog/latest/"` in the front-matter for that page. That way Jekyll knows where to put the final generated HTML file for that page.

## Conclusion

That was all, a simple way to add a URL to your Jekyll site which will always take the visitor to your latest blog post. You can take a look at the full source code of my website over at [GitHub](https://github.com/VarunBarad/varunbarad.github.io/tree/development) or you can also find the full code of this “latest post redirect” page at [this link](https://github.com/VarunBarad/varunbarad.github.io/blob/development/latest-post-redirect.html).

If you want to talk with me about anything related to this feel free to reach out to me on twitter [@varun\_barad](https://twitter.com/varun_barad)
The Initial 3 Posts
Tags: career, productivity, writing, podcast
Published: 2019-10-08 06:16:47

I found myself here through the React Podcast, the episode featuring `Emma Wedekind`, where the hosts talked about `medium` vs `dev.to`. 

Here I am, appreciating the default markdown option : )

I have not thought through what to post, but as a start, just a few muddy thoughts:

- [When Will I Suffer Career Crisis as A Software Engineer?](https://dev.to/tuwang/when-will-i-suffer-career-crisis-as-a-software-engineer-3kaa)
- [Retrospective on Our Introvert Engineering Personality](https://dev.to/tuwang/retrospective-on-my-introvert-engineering-personality-6d)
- [How to Succeed in Code Review as a New-hire (w/o being bashed)](https://dev.to/tuwang/how-to-succeed-in-code-review-as-a-new-hire-w-o-being-bashed-3ega)


Other considerations:
- Why does `logical reasoning` bothers people? Answer is pretty easy: they are not the right audience and you better stop being selfish.
- What is different from running a project to running a company? I'm curious to find out, so I'll start a discussion post about it.

A little bit of context, in my career development, I recently came to realize that I have to write a lot more. The above is a self-challenge to write.
Dont Let Your Project Ice Over
Tags: codequality, productivity, watercooler, webdev
Published: 2019-10-08 06:13:18

Hello and Welcome to my Corner!

## An Introduction to Myself

I like to make my posts into a conversation or at least like I told them to you from across the table. I was thinking of how to start out writing to this great community and I finally came up with a great Ice Breaker! Oh the pun.

## Workloads that Create Ice

My workload consists of managing a multitude of projects this is partly a disaster of my own making but also a result of time spent working. I have over 100 projects that are published to the internet. That being said there is no good way to either reduce the number of projects or touch them more often.

## What is Project Icing

That is where this article comes to a head. A common problem I run into with my projects is ice over the project leaving me foggy on what to do or where to go. Like most developers I employ a small army of task management tools but honestly these ice over just as easily as the project itself.

That is what I have come up with a small concise solution to help with project ice:

## Write Your Last Thought Into resume.txt

Yep! That is it, our brains are like relational databases in their own way and we usually need a link to stir our memory and jog that mental space back into the clear.

## An Example

So lets try this out for an example.

I just finished working on my latest project putting in a subscription module to collect email addresses before launch. It's late and then writing this post took some more time so I am plenty ready for bed. Its time to setup a resume.txt, it should be simple and leave a simple task at hand to get the next round of coding off the ground in a flash.

Here is my example

*resume.txt*
```
Okay, its been a good session.
Now you must finish the sign up page scripting to handle validation.
```

Again, nice and simple. The simpler the better, the more complexity there is in the message the more it serves to add to the ice.

## Why resume.txt?

Well it is also imperative to have a nice consistent place to look to get the memory stir going, this goes back to having a multitude of task managers that confuse the idea of where to look to get started.

## Why I Think resume.txt Works

I am a post it note kind of person, I like short concise notes that embellish a larger more complex thought that is stored elsewhere. I believe this is a post it note system that can stay consistent across any project. I would also recommend against putting this file into version control as it should be personal to the developer.

Let me know what you think!
JAMstack MDX Deck 
Tags: gatsby, javascript, react, netlify
Published: 2019-10-08 06:09:38

---
title: JAMstack MDX Deck 
published: true
description: Presentation about “Modern Web Development on the JAMstack”
tags: gatsby, javascript, react, netlify
cover_image: https://www.thespruceeats.com/thmb/RxM79FOae-OtKFGk9LcD5rvSizk=/960x0/filters:no_upscale():max_bytes(150000):strip_icc():format(webp)/homemade-fresh-fig-jam-3057845-Hero1-5b58a50b46e0fb0024bafbd2.jpg
---

<p align="left">
  <a href="https://github.com/iamskok/jamstack.systems/">
    <img alt="JAMstack.systems logo" src="https://jamstack.systems/logo.svg" width="60" />
  </a>
</p>


[JAMstack.systems](https://github.com/iamskok/jamstack-gatsby-mdx-deck) is the presentation about fast, secure and dynamic sites built with **J**avaScript, **A**PIs, and prerendered **M**arkup, served without web servers. **I'll appreciate it if you will star the** [**repo**](https://github.com/iamskok/jamstack-gatsby-mdx-deck) **and share the** [**deck**](https://jamstack.systems) **on twitter.**

## Table of content 📖

* **The Challenges of Modern Web Development** 💦
   * [Monolothic Architectures](https://jamstack.systems/2) 🧟‍♂️
   * [GIF of Pain](https://jamstack.systems/3) 🤕
   * [Limited Flexability](https://jamstack.systems/4) 🤕
   * [Performance Concerns](https://jamstack.systems/5) 🐢
   * [Scaling Challenges](https://jamstack.systems/6) ⚠️
   * [Security Woes](https://jamstack.systems/7) 🕵️‍♀️
* **WTF is JAM?** 🙀
   * [What’s in a Name](https://jamstack.systems/8) 🤨
   * [Stacks Comparison](https://jamstack.systems/9) 📊
   * [New architectural constraints](https://jamstack.systems/10) 🏔
   * [JavaScript](https://jamstack.systems/11) 💛
   * [APIs](https://jamstack.systems/12) ⚙️
   * [Markup](https://jamstack.systems/13) 📝
   * [Serverless](https://jamstack.systems/14) 🔌
   * [Ecosystem](https://jamstack.systems/15) 🌐
* **Advantages of the JAMstack?** 💪
   * [Simplifying Systems and Thinking](https://jamstack.systems/16) 🧠
   * [Costs](https://jamstack.systems/17) 💰
   * [Scale](https://jamstack.systems/18) 🌱
   * [Performance](https://jamstack.systems/19) ⚡️
   * [Request Life Cycle](https://jamstack.systems/20) ️️️️♻️
   * [Security](https://jamstack.systems/21) ️️️️🔐
* [**Summary**](https://jamstack.systems/22) 🤓
* [**Resources**](https://jamstack.systems/23) 📚
* [**About**](https://jamstack.systems/24) ❓

## About [JAMstack.systems](https://github.com/iamskok/jamstack-gatsby-mdx-deck)

* Built with Gatsby and MDX Deck
* Styled with Theme UI
* Assets are managed by Cloudinary
* Hosted by Netlify

## [Presentation link](https://jamstack.systems/)
Dev Discovery - Angular stops hot reloading on my VSCode Editor
Tags: devdiscovery, angular, vscode, hotreload
Published: 2019-10-08 04:42:33

Normally, your angular app will re-compile after hitting that save (ctrl+s) and will reload your page on the browser. But when your app gets bigger, as I understand it correctly, it will have some memory leak and will stop the hot reloading. A small popup will appear on your VS Code and will give you the following error:

_"Visual Studio Code is unable to watch for file changes in this large workspace" (error ENOSPC)_

This gives you a notification that you need to increase the size of your watcher to listen for file changes. You can check/view your current watcher size by typing the following on your terminal:

```
cat /proc/sys/fs/inotify/max_user_watches
```

I have experienced this using a linux/ubuntu OS, and to resolve this, you can increase the size of the watcher by typing:

```
$ sudo sysctl fs.inotify.max_user_watches=524288
$ sudo sysctl -p
```
*skip the $ symbol*

Your watcher is now updated to listen to 524288 or 512 MB of file changes.

Finally, re-run your app (i.e. ctrl+c and npm start or ng serve).

Resources:
* https://code.visualstudio.com/docs/setup/linux#_visual-studio-code-is-unable-to-watch-for-file-changes-in-this-large-workspace-error-enospc
* https://github.com/guard/listen/wiki/Increasing-the-amount-of-inotify-watchers#the-technical-details
🤷‍♀️Identicons🙋‍♂️ in the Uncanny Valley🌄
Tags: react, microservices, saas
Published: 2019-10-08 03:52:11

Identicons are quirky little things you've undoubtedly seen all over the internet. They're these weird geometric patterns and they are a visual identifier of a hash value. Here are some places you've probably seen these cute shapes:

* Github
* Gravatar
* Wordpress


>I originally came up with this idea to be used as an easy means of >visually distinguishing multiple units of information, anything that can >be reduced to bits. It’s not just IPs but also people, places, and >things. IMHO, too much of the web what we read are textual or numeric >information which are not easy to distinguish at a glance when they are >jumbled up together. So I think adding visual identifiers will make the >user experience much more enjoyable.
>— Don Park, Creator of Identicons


I'd like to present to you all a new type of identicon microservice that lives more in the uncanny valley of uniqueness.


# Introducing [Face Hash](https://facehash.0xbanana.com)! 🎉🎉🎉
![Face Hash - Identicon Uncanny Valley](https://thepracticaldev.s3.amazonaws.com/i/ixwpuunjet82bvflo11b.png)

Supply your own text or hash, and get back the same unique face every time! Feel free to hotlink to embed these face identicons in any of your upcoming applications!

Hotlinks can point to `https://i.facehash.0xbanana.com/<hash>`

If you use this in your next project drop me a line!

---
Enjoyed this post? Let me know! 💛 🦄 🔖
CSS Challenges #1 | Breadcrumbs
Tags: css, challenge, easy, ui
Published: 2019-10-08 03:13:06

## Submissions

{% link https://dev.to/mikister2012/css-challenges-results-1-breadcrumbs-bi3 %}

## What is this

I'm starting a new series aimed at helping you improve your css skills by challenging you to recreate a suggested feature or element. I'll only be posting things that will be of use when building your websites or apps. So no code golf or obscure stuff.

This is a weekly challenge, so every Monday there will be a new thing for you to build. Also every Monday, alongside the challenge, I'll give a suggested solution to last weeks' challenge.

Post links to your solutions (codepens, jsfiddles, etc.) in the comments if you solved the challenge.


## Breadcrumbs

So the first challenge is to make breadcrumbs. Commonly used in larger websites as secondary navigation.

### Requirements

* parent element that holds individual items should use the `nav` tag
* each item uses `a` tag for links
* each item is somehow separated, either with text (`>` or `/`, traditional) or visually (modern)
* last item should have special styling

----

## Read More

* [SMASHING Magazine - Breadcrumbs In Web Design: Examples And Best Practices](https://www.smashingmagazine.com/2009/03/breadcrumbs-in-web-design-examples-and-best-practices/)
My Journey Thus Far - Day 1
Tags: codenewbie, selftaught
Published: 2019-10-08 02:58:30

I have been learning coding seriously since July and one of the things I want to do is document what I learn everyday and track what I do. The goal is to use this as a motivation for those days that I am feeling like I am not getting it. I also love seeing the progress I make in what I know.

So, what have I been doing?

I have taken some bootcamp prep courses. I was due to start at Lambda in August and  finished their prep course but due to changes in work, I couldn't focus on that and decided that while I am figuring work out, I will continue to learn on my own. 

One of the first things I realized was that I was not as comfortable with HTML and CSS as I thought. The prep courses barely spent a section on them. So I had to get better and I decided to do the Colt Steele Udemy course. While I learned a lot, I still wanted to know more about CSS and that is when I purchased Brad Traversy's Modern HTML and CSS course. I am 70% done with the course and I must say, it delivered. I feel more confident about my CSS skills but I must practice and do more projects on my own.

I have read enough about other coder's journey to be aware of tutorial purgatory. To that end, I created my own curriculum and I am sticking to it. This is what it looks like so far:

1- Colt Steele HTML/CSS
2- Brad Traversy - Modern HTML & CSS From The Beginning.
3- Colt Steele - Bootstrap Section
4- Odin Project - HTML & CSS
5- Brad Traversy - Sass Section
6- Free Code Camp Responsive Web Design Projects

I don't limit myself to just these as a learning resource. I read documentation, watch other short videos and read other's solutions. I just did not want to jump from course to course but also didn't want to just complete one. I've learned different as each teacher prioritize something that the other does not go over.

I am projecting to complete this section by end of October/ early November and then I'm on to JavaScript. I have a general idea for that part but I am looking into how HTML and CSS goes and see if there are any changes to how I study. I will share when I have that planned out.

I am happy to be a part of this community and I am open to feedback.
Customizing Emacs for Editing org Files
Tags: emacs, orgmode
Published: 2019-10-08 02:50:45

My preferred way to use Emacs is to open it to edit a particular filetype with a custom init file. Most commonly, this is a .org file that I'm opening with a script. The primary advantage of using a custom init file is that you can optimize Emacs for one type of file without causing conflicts for other modes. Emacs is almost unusable in its raw form. [Duplicating a line](https://stackoverflow.com/a/88737/2225804) requires this mess: `C-a C-SPACE C-n M-w C-y`. Obviously, nobody wants to deal with that. It's easier to select, copy, and paste the line than to type that - assuming you can even remember it.

I open .org files with a command like this:

```
emacs -q -l custom.el foo.org
```

This opens file foo.org using custom.el as the init file. Inside custom.el are the lines:

```
(setq inhibit-startup-screen t)
(global-set-key (kbd "C-c x") 'org-cut-special)
(global-set-key (kbd "C-c c") 'org-copy-special)
(global-set-key (kbd "C-c v") 'org-paste-special)
(cua-mode t)
```

The first line makes Emacs open without the annoying startup screen that for some reason opens by default no matter what. You'll go crazy if you have to deal with it every time you open a .org file, so get rid of it. Lines 2-4 make it possible to cut, copy, and paste items in your outline. This is really handy for moving content around. Line 5 is by no means necessary, but I always forget which of `C-w` and `M-w` is copy and which is paste. cua-mode gives copy, cut, and paste the normal shortcuts of `C-c`, `C-x`, and `C-v`.

This minimal configuration file is sufficient to make me extremely productive editing .org files that contain project information, checklists, and any other information I need to track.
How to use MacOS's Touch ID on Terminal
Tags: macos, productivity, hacks
Published: 2019-10-08 02:29:00

I know... use a fingerprint scanner and never come back. No need to write passwords, pins or patterns. But on the terminal when we use the magic word `sudo` ask for your password... yuck!!! 

![Yucky](https://media.giphy.com/media/pSN7whJCjbYC4/giphy.gif)

Don't worry. It can be solved easily because with **macOS Sonoma**, there is now a supported option to enable Touch ID for sudo:

```bash
sudo cp /etc/pam.d/sudo_local.template /etc/pam.d/sudo_local
sudo nano /etc/pam.d/sudo_local
```
Uncoment the last line of the file by removing the `#` from the start of the line.

```txt
# sudo_local: local config file which survives system update and is included for sudo
# uncomment following line to enable Touch ID for sudo
auth       sufficient     pam_tid.so
```

Save changes with `ctrl+x` and overwritte the file.

## Extra

On the default terminal works like a charm, but on **iTerm2** needs an extra configuration. Go to `Prefs -> Advanced -> Allow sessions to survive logging out and back in` and set the value to `no`.

![Easy Peasy Japanesey](https://thepracticaldev.s3.amazonaws.com/i/i320zlek27xhxgm1mumw.png)

Restart and enjoy it.

---

**That's All Folks!**
**Happy Coding** 🖖

[![beer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mkgsx4aw6qn9i9ax6as9.png)](https://github.com/sponsors/deinsoftware)