teleren/devto huggingface dataset:
Hello lövely world
Tags: love2d, lua, gamedev
Published: 2021-01-09 22:11:13

Install LÖVE, then:

```
mkdir my-little-game
cd my-little-game
touch main.lua
# edit main.lua as you please
love .
```

Hello world:

```lua
function love.draw()
    love.graphics.print("Hello World!")
end
```

With a color:

```lua
green = {0, 255, 0}

function love.draw()
    love.graphics.print({green, "Hello World!"})
end
```

With many colors:

```lua
green = {0, 255, 0}
red = {255, 0, 0}
orange = {255, 165, 0}
yellow = {255, 255, 0}
green = {0, 255, 0}
blue = {0, 0, 255}
indigo = {75, 0, 130}
violet = {238, 130, 238}

function love.draw()
    love.graphics.print({red, "R", orange, "A", yellow, "I", green, "N", blue, "B", indigo, "O", violet, "W"})
end
```
Outside of JSX Scope
Tags: react, javascript, codenewbie, programming
Published: 2021-01-09 22:05:50

###### *This article is sponsored by [Fiverr](http://www.fiverr.com/s2/fa85266916) - Freelance to get extra income or become a full-time freelancer.*

This article is pending... Check out my other React articles above.

**Happy Coding!!!**

<a href="https://www.buymeacoffee.com/bellotech" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a> 

{% user bello %}
#### Techstack | Fiverr
Techstack article, sponsored by Fiverr.
- Connect to freelancers with proven business experience.
- Get matched with the perfect talent by a customer service manager.
- Freelance to get extra income or become a full-time freelancer.

[Sign up](http://www.fiverr.com/s2/fa85266916) to find the perfect freelance services for your business or become a freelancer.

{% youtube EkPDLVqKkLc %}

[Support](https://dashboard.flutterwave.com/donate/3lo9klliqwbu) what I do and push me to keep making free content.
Custom Phone Mockups for Onyx Boox Note Air
Tags: creativity, watercooler, design
Published: 2021-01-09 22:01:18

When I'm doing mockup prototyping for user interfaces, I still prefer painting by hand rather than using mockup tools.
I feel confident with [draw.io](https://draw.io/), but not for the first prototyping session.
There you just have to be creative. And creativity does not come from a UI design tool.

Since I just got a new Onyx Note Boox Air, I've created new templates for mobile device mockups.
There are three version inside the package, two iPhone and an Android mockup.

### Installation

Just download them and put them onto your device in the `noteTemplate` directory.

### Download

The templates are available from my GitHub repository:
[Download the templates](https://github.com/davidkroell/davidkroell.com/tree/main/content/blogposts/2020/custom-mockups-for-onyx-boox-note-air)

There is also a GIMP source file here.
Terraforming mac1.metal at AWS
Tags: aws, terraform, tutorial
Published: 2021-01-09 21:51:31

> **Updated on the 23rd of October, 2021: Terraform AWS provider now [supports](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/resources/ec2_host) Dedicated Hosts natively**

In November 2021, AWS [announced](https://aws.amazon.com/blogs/aws/new-use-mac-instances-to-build-test-macos-ios-ipados-tvos-and-watchos-apps/) the support for Mac mini instances.

I believe this is huge, even despite the number of constraints this solution has. This offering opens the door to seamless macOS CI/CD integration into existing AWS infrastructure.

So here is a quick-start example of creating the dedicated host and the instance altogether using Terraform.

I intentionally used some hardcoded values for the sake of simplicity in the example.

```hcl
resource "aws_ec2_host" "example_host" {
  instance_type     = "mac1.metal"
  availability_zone = "us-east-1a"
}

resource "aws_instance" "example_instance" {
  ami           = data.aws_ami.mac1metal.id
  host_id       = aws_ec2_host.example_host.id
  instance_type = "mac1.metal"
  subnet_id     = data.aws_subnet.example_subnet.id
}

data "aws_subnet" "example_subnet" {
  availability_zone = "us-east-1a"
  filter {
    name   = "tag:Tier" # you should omit this filter if you don't distinguish your subnets on private and public 
    values = ["private"]
  }
}

data "aws_ami" "mac1metal" {
  owners      = ["amazon"]
  most_recent = true
  filter {
    name   = "name"
    values = ["amzn-ec2-macos-11*"] # get latest BigSur AMI
  }
}
```

Simple as that, yes. Now, you can integrate it into your CI system and have the Mac instance with the underlying host in a bundle.

💡 Pro tip: you can leverage the `aws_ec2_instance_type_offerings` [Data Source](https://registry.terraform.io/providers/hashicorp/aws/latest/docs/data-sources/ec2_instance_type_offerings) and use its output with `aws_subnet` source to avoid availability zone hardcoding.

To make the code more uniform and reusable, you can wrap it into a [Terraform module](https://serhii.vasylenko.info/2020/09/09/terraform-modules-explained.html) that accepts specific parameters (such as `instance_type` or `availability_zone`) as input variables.

---
If you liked the article, please support me by sharing it on social networks 🙏

---
{% user svasylenko %}
StocksDog
Tags: dohackathon
Published: 2021-01-09 21:50:38

---
title: StocksDog
published: true
description: Stocks monitoring app for the DigitalOcean App Platform Hackathon
tags: dohackathon
---
### Category Submission: 
Built for Business

### App Link
https://stocksdog.fangsystems.tech

### Description
StocksDog is a Svlete based app designed to let you monitor stocks prices both in real time and historically, leveraging the [Finnhub](https://finnhub.io) API to retrieve financial data.
Sadly my backend stopped cooperating right before submission time. School work made it that i didn't have much time to resolve the issue and so only the default 3 symbols are available, with intermittent data availability (sometimes it just plain won't work, i know that's not a good thing to present) :(

### Link to Source Code

[Github repo](https://github.com/ItsNewe/StocksDog)

### Permissive License
MIT License

## Background
Being an avid fan of both techy and financial stuff, i thought this project would be a fun way of putting everything together, and it would also let me play around with Svelte, a framework that i hadn't ever worked with before.

### How I built it 
I used DigitalOcean's App Platform as a way to host the 'production' version of my application.
How I Built the Best Tic-Tac-Toe Game Ever
Tags: dohackathon, redis, node
Published: 2021-01-09 21:36:06

## What I built
Multiplayer tic-tac-toe using AdonisJS, Websockets and Redis. 
### Category Submission:
Since this is a fun game, it fits into the Random Roulette category.

### App Link
https://tic-tac-toe-trm58.ondigitalocean.app/

### Screenshots
![Initial](https://dev-to-uploads.s3.amazonaws.com/i/4jse4w1ce3m8h3u5396z.png)
 
![game loaded](https://dev-to-uploads.s3.amazonaws.com/i/xwhxuuc13cni1ahiyv0g.png)
![vicradon won](https://dev-to-uploads.s3.amazonaws.com/i/x4uns5k6apu62xgoxxof.png)
![loser's side](https://dev-to-uploads.s3.amazonaws.com/i/dpgvd8dme7sn5jldziix.png)
![rematch](https://dev-to-uploads.s3.amazonaws.com/i/8efdiy7es224ogxl82fe.png)
    


### Description
A multiplayer Tic-Tac-Toe which uses Redis for storing game state during play. It uses web socket technology to enable real-time communication

### Link to Source Code
https://github.com/vicradon/tic-tac-toe

### Permissive License
The source code is licenced under the MIT Licence.

## Background
![game-pads](https://dev-to-uploads.s3.amazonaws.com/i/m9ga1d4hxzdfozigz1o0.jpg)
 
<span>Photo by <a href="https://unsplash.com/@ingvar_erik?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Igor Karimov</a> on <a href="https://unsplash.com/s/photos/gaming?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>

I wanted to improve my Node.js skills by building something cool. I thought to myself, what's cooler than games? Nothing is cooler than games. So I started building the game.

### How I built it
I mostly wrote down my tasks on each day of development in the README. When I completed those tasks, I commit and push to Github.
Info products suck - gain your own experience
Tags: learning, selfimprovement, independentthinking, reflections
Published: 2021-01-09 21:34:54

---
canonical_url: https://alexbezhan.com/info-products-suck-gain-your-own-experience/
---

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

The best way to learn is through **your own reference experience**.

Info gurus will tell you that the best way is to buy their stuff. Even though it is a good option, it's not the best one.

If you want to become great at what you do, you have to be willing to do what most people don't. Go out, do the thing on your own and gain your own experience.

**Info products are overrated.**

Looking back at how many info products I bought(a lot), I can say that I only got value from a small fraction of information. And the more products I consume, the less importance I give to them, the less effort I put in.

Over time info products stop working.

**The most important part of an info product is not the product itself.**

> It's you practicing and implementing stuff. Practice drives your progress.

##Do. Reflect on how it went.

Reflection is underrated. It's essential. Let me repeat. Reflection is essential. Reflecting on your progress gives you an x10 advantage easily.

Reflection is hard because you cannot buy it. It has to come from within. It requires effort. The good thing is that it's a muscle that you can train, and you just become good at it over time.

##Doing it on your own makes you see what others don't.

When you learn and practice by yourself, it forces you to discover things on your own. You are not anchored by a [group think](https://en.wikipedia.org/wiki/Groupthink).

You approach a problem from unique angles that may not be seen before by others. You gain a unique perspective on the situation.

It makes you different.

> Explore unique angles.
Have a unique perspective.
Be different. Be creative. Be you.

##Write about it.

Writing about what you do is a great way to reflect. It forces you to reconstruct what you did and how well you performed.

Writing it in a way that other people can understand forces you to structure your thought process. It will make you see the gaps in your experience. Maybe you did something wrong. Perhaps you forgot something. And all of that becomes clear when you write about it.

##Takeaways:

- Practice drives your progress. Not info products
- Reflection is essential
- Write about what you do: start a blog, tweet, whatever
Want to hear more from me? You can follow me on Twitter as I will continue my journey to financial independence and self-improvement.

Want to hear more from me? You can **[follow me on Twitter](https://twitter.com/AlexBezhan)** as I will continue my journey to financial independence and self-improvement.
Problem with external images  - gatsby
Published: 2021-01-09 21:28:37

I read a lot about gatsby and picture plug-ins, but I don't know if I'm doing it right. I want to edit a theme because I can't post images with external url. 

Only the image from the src folder etc. works.

Can someone tell you how to fix it? I am rather a beginner in graphql and react


post like this work:
`---
title: Ititle
date: "2020-01-26"
thumbnail: ./img-22.png
description: workin
---`

but i cant as thumbnail put image from external url like https://tumblr.com/image.png
Manage bookmarks quickly with Raindrop
Tags: productivity, webdev, zen, tools
Published: 2021-01-09 21:28:27

## Import with Chrome Bookmarks

You can import Google Chrome Bookmarks in Settings > Import 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/aaztbc12y4zsjnmfx9mi.png)

Here is an example of autogenerated bookmark export file :

```html
<!DOCTYPE NETSCAPE-Bookmark-file-1>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<TITLE>Raindrop.io Bookmarks</TITLE>
<H1>Raindrop.io Bookmarks</H1>
<DL><p>
	<DT><H3 ADD_DATE="1609931024" LAST_MODIFIED="1609931274">Parent Folder</H3>
		<DL><p>
			<DT><H3 ADD_DATE="1609931025" LAST_MODIFIED="1609931253">Child Folder 1</H3>
			<DL><p>
				<DT><A HREF="https://my-link-1.com" ADD_DATE="1607944352" LAST_MODIFIED="1609931043" TAGS="">My Link 1</A>
				<DT><A HREF="https://my-link-2.com" ADD_DATE="1607944352" LAST_MODIFIED="1609931043" TAGS="">My Link 2</A>
			</DL><p>
			<DT><H3 ADD_DATE="1609931025" LAST_MODIFIED="1609931253">Child Folder 2</H3>
			<DL><p>
				<DT><A HREF="https://my-link-1.com" ADD_DATE="1607944352" LAST_MODIFIED="1609931043" TAGS="">My Link 1</A>
				<DT><A HREF="https://my-link-2.com" ADD_DATE="1607944352" LAST_MODIFIED="1609931043" TAGS="">My Link 2</A>
			</DL><p>
		</DL><p>
</DL><p>

```

## Create Folders and Categories

Move bookmark into folder and categories.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vw5z8kvhtikscibcu1ji.png)

You can rename a folder and add an icon.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/y8113ucoauva4nis1n55.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/or4qn7baqjx5mnjpwv95.png)

## Link

[Raindrop](https://raindrop.io/)
Volta + Netlify
Tags: ember, netlify, volta
Published: 2021-01-09 21:17:54

## Volta

On my frontend projects I like to use [Volta](https://volta.sh/) to pin down [node](https://nodejs.org/en/) and [yarn](https://yarnpkg.com/) versions to make sure that it builds the same every time. It's as simple as:

```sh
# install volta via: https://volta.sh/

❯ volta pin node
success: pinned node@14.15.4 (with npm@6.14.10) in package.json

❯ volta pin yarn
success: pinned yarn@1.22.5 in package.json
```

And from now on every environment that has _volta_ installed respective versions of _node_ and _yarn_ will be used. Automatically, no manual switching necessary.

## The problem

Unfortunately my favourite frontend hosting service - [Netlify](https://www.netlify.com/) does not support _volta_ out of the box. Which I found the hard way after a project update. Although it compiled fine on _localhost_, it refused to work with the default version of _node_ on _netlify_.

## Solution

After a little bit of googling I found an-OK solution in [Netlify file based configuration](https://docs.netlify.com/configure-builds/file-based-configuration/). The file `netlify.toml` goes to the root of your repo:

```ini
# netlify.toml
[build.environment]
  NODE_VERSION = "14.15.4"
  YARN_VERSION = "1.22.5"
```

## Conclusion
- Different (major) versions of _node_ can be incompatible and code running fine under one might fail to build under other.
- If you want to pin _node_ and _yarn_ version for _netlify_, use `netlify.toml` config.

-----
<span>Photo by <a href="https://unsplash.com/@scottsanker?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Scott Sanker</a> on <a href="https://unsplash.com/s/photos/glue?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>
Polygon to clip-path & SVG
Tags: css, design, codepen, javascript
Published: 2021-01-09 21:13:06

I've made a new `clip-path`-tool, which makes it easier to create equal-sided polygons, from 3-sided triangles to a hundred-sided hectogon.

You get live feedback and generated code for both CSS `clip-path` and inline `SVG`.

![Polygon Editor](https://dev-to-uploads.s3.amazonaws.com/i/gsk3qpz8baf8hm87vp6j.png)
 
Drag the `sides`-range-slider to set the number of sides. The `inset`-range-slider creates a point on the middle of each side, and the amount you set drags it "inwards" for cool effects. 

If you chose the first, transparent image, the color of the color-picker will be used:

![Blue Star](https://dev-to-uploads.s3.amazonaws.com/i/phfkuwah5kg853jmcddt.png)
 
Otherwise, chose one of the sample images:

![Image Star](https://dev-to-uploads.s3.amazonaws.com/i/e39d7c90xw2yn7w4xahz.png)

When you hover the "Animation Preview"-area, you'll see a transition between the original `inset` and the `animation inset`:

![Animation Preview](https://dev-to-uploads.s3.amazonaws.com/i/d73a1h6y752rx3m2arai.png)

The tool works best in [fullscreen on Codepen](https://codepen.io/stoumann/full/MWjBRJv), but here's an inline version as well:

{% codepen https://codepen.io/stoumann/pen/MWjBRJv default-tab=result %}

If you prefer a `clip-path`-tool with draggable points (for simpler shapes), use my original tool:

{% codepen https://codepen.io/stoumann/pen/abZxoOM default-tab=result %}

Thanks for reading - hope you'll enjoy the tools!
Capture screenshot or record video of the iOS Simulator using Terminal
Tags: ios, xcode, simulator, terminal
Published: 2021-01-09 20:51:17

An alternative to using Quicktime or other ways of screengrabbing the simulator

##Capture screenshot/photo of the iOS simulator

Usage:
`xcrun simctl io booted screenshot myImageScreenshot.png`

Steps:
1. Launch simulator
2. Open Terminal and enter the above command
3. The current directory will contain your saved screenshot

##Record a video of the iOS simulator

Usage:
`xcrun simctl io booted recordVideo myNewVideo.mov`

Steps:
1. Launch simulator
2. Open Terminal and enter the above command, this will start the video recording
3. When you are done recording, hit `CTRL` & `C`

The current directory will contain your saved video
Eight Queens Puzzle
Tags: showdev, vue
Published: 2021-01-09 20:40:59

I came across the eight queens puzzle in a computer game and as I learned more about it, I thought it would be cool to code for one of my projects.

As I create new projects, I try to incorporate my own designs. The queen svg pieces were all created using Inkscape based on the image from the [puzzle's Wikipedia's page](https://en.wikipedia.org/wiki/Eight_queens_puzzle). :art:

The game board can be navigated using arrow keys and there is more than 1 solution to solving it.

If there's anything I can improve on in terms of accessibility please let me know and I'll do my best to fix it.

Thanks for reading. :crown:

- [Repo](https://github.com/Dana94/eight-queens-puzzle)
- [Live](https://ecstatic-bartik-944ecc.netlify.app/)
Free JavaScript Resources - java5cript.com
Tags: javascript, react, free, resource
Published: 2021-01-09 20:32:58

# Introducting Java5cript.com

Have you always wanted to learn JavaScript but not sure where to start? Not sure whether a source is reputable or teaching you up to date information? Or do you simply want a collection of free JavaScript resources to get you started on your learning path?

I'm happy to announce my latest side project, [Java5cript.com](https://www.java5cript.com/)

Version one of Java5cript covers:

- Books
- Websites
- Course
- & Videos

# What's Coming?

### More resources

Weekly updates of new and found resources.

### Build to learn

Learn JavaScript syntax & fundamentals by building 5 projects at your own pace. From declaring variables to looping over API data. Get started with, 'build to learn' coming soon!

### Learn by topic

JavaScript is a complex language with various concepts to learn. Java5cript will provide drilled down resources for each topic.

### Further subcategories

Java5cript covers mostly vanilla JavaScript resources. In the future, it will include other subcategories such as React, Vue & Node.

# Submit A Resource

Have you built or recorded an awesome free JavaScript resource? Maybe you have stumbled upon one that you found really useful? Either way, use the form on the (submit page)[https://www.java5cript.com/submit] to send a resource.

# Updates & Feedback

If you want to keep updated with new resources or provide some feedback, lets keep in touch on (Twitter)[https://www.twitter.com/frontenddude].
Dev Dad Jokes - My submission to the DigitalOcean App Platform Hackathon!
Tags: dohackathon
Published: 2021-01-09 20:18:59

---
title: Dev Dad Jokes - My submission to the DigitalOcean App Platform Hackathon!
published: true
description: My submission to the DigitalOcean App Platform Hackathon!
tags: dohackathon
---

## What I built

I built a simple little Dev Dad Joke generator. Hit refresh for a new joke.

### Category Submission: 

Random Roulette

### App Link

https://devdadjokes-9fybd.ondigitalocean.app/

### Screenshots

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/r6jvfh1cct26alzz4ijc.png)

### Description

I only learned about the DigitalOcean App Platform Hackathon two days ago. With going on leave next week, and having the weekend to build something, I needed to come up with something small, that I could develop and deploy quickly.

A quick online search for a free, open source Joke API, and I was off to the races.

### Link to Source Code

https://github.com/jonathanbossenger/devdadjokes

### Permissive License

https://choosealicense.com/licenses/mit/

## Background

I'm a developer, a dad, and I love dad jokes, and I had an evening to build something.

### How I built it 

I used Laravel to build it, as it's the quickest I'd be able to get something off the ground with a basic front end UI out of the box, that I could customize. 

I searched for a free and open source Joke API, and found one on GitHub at https://github.com/Sv443/JokeAPI.
AWS Power Hour: Great series of lessons to help with AWS Cloud Practitioner exam
Tags: aws, cloud
Published: 2021-01-09 20:08:40

AWS Power Hour is a great course to help learn AWS!
### [AWS Power Hour](https://pages.awscloud.com/awspowerhour_cloud_practitioner_resources.html)

It includes quizzes, videos, links to important resources and all in a six episode series that encapsulates everything you need to know for your Cloud Practitioner exam. And what's more... it's free! I want to take a moment to explain why I love this course.

The course is wide ranging but also the best aspect was the inclusive approach that the AWS Technical Evangelists brought to the twitch series that accompanied AWS Power Hour.
### [AWS ](https://www.twitch.tv/videos/775346474)

##### Diagrams

One aspect of the teaching during the AWS Power Hour course was the emphasis on improving our diagrams. Our homework included a task to draw a highly available web application running on Amazon EC2 within a region. 

![Screenshot 2021-01-09 at 19 42 02](https://user-images.githubusercontent.com/27693622/104107253-c7857280-52b2-11eb-980e-595000c64d90.png)

My diagram used an Elastic Load Balancer, Virtual Private Cloud and EC2 instances running in separate regions and public subnets. Not great for security but highly available at least!
![Screenshot 2021-01-09 at 09 01 31](https://user-images.githubusercontent.com/27693622/104106927-da974300-52b0-11eb-849d-09af0f90694b.png)

Another homework asked us to draw a highly available and automatically scaled 

![Screenshot 2021-01-09 at 19 42 11](https://user-images.githubusercontent.com/27693622/104107609-76c34900-52b5-11eb-9356-d5943c0b0278.png)

![Screenshot 2021-01-09 at 20 07 32](https://user-images.githubusercontent.com/27693622/104107713-5647be80-52b6-11eb-9606-84aca354dab0.png)

This is a great course and I look forward to sharing progress. 

##### Andrew Brown's Cloud Practitioner Overview

Another useful video is Andrew Brown's epic overview of the AWS Cloud Practitioner exam:
[![Screenshot 2021-01-10 at 14 58 31](https://user-images.githubusercontent.com/27693622/104126422-5d250e80-5354-11eb-861e-1aedd0cd457f.png)](https://www.youtube.com/watch?v=3hLmDS179YE)
About python OOP's concepts
Published: 2021-01-09 20:06:21

Note: Each day this week I'm going to republish one of my most popular posts. My hope is that people who missed them the first time might find them useful now. This post, on "classes" and Object Oriented Programming remains my most popular post of all time. I've gotten hundreds of emails about this post alone. Many have found it an accessible introduction to classes and OOP, both in Python and in general.

The class is a fundamental building block in Python. It is the underpinning for not only many popular programs and libraries, but the Python standard library as well. Understanding what classes are, when to use them, and how they can be useful is essential, and the goal of this article. In the process, we'll explore what the term Object-Oriented Programming means and how it ties together with Python classes.