teleren/devto huggingface dataset:
Design Critique: Portfolio Danjel.dev
Tags: beginners, design, ux, webdev
Published: 2019-06-19 15:53:45

In this video, we'll take a look at another developer portfolio and give some tips and tricks around visual hierarchy and spacing.

I talk about how to space elements to allow a user room to read, as well as how to use font sizes and line heights to give clear indication of important content on the page.

His website is [danjel.dev](danjel.dev) and you can follow along with the video and take a look at it yourself!

{% user danjelvdwal %}

## Would you like a design or code review?

I've started a site off of the DEV platform to collect requests for code, design and resume reviews. I'm partnering with my friend [James Q. Quick](https://learnbuildteach.com). He'll provide amazing code reviews ([like this one](https://www.youtube.com/watch?v=dgttPoE_R5Q)), I'll provide design critiques and we'll both take a look at resumés submitted.

### Go over to [PeerReviews.dev](https://peerreviews.dev) to request a review!
Using Typescript with modern React (i.e. hooks, context, suspense)
Tags: react, typescript, javascript, webdev
Published: 2019-06-19 15:52:55

In this video you will learn how to add typescript to a create-react-app project as well as adding it to a react project from scratch with webpack and babel. You will learn a bit about react hooks, (useState, useContext, useReducer and useEffect), in a react typescript project as well as using suspense to lazy load a component. We will also attempt to recreate redux, (or the redux principles) with useReducer and Context.

{% youtube BnIhk4igd8I %}
Pure CSS Projects Intro
Tags: html, css
Published: 2019-06-19 15:43:31

---
title: Pure CSS Projects Intro
published: true
description: Template to showcase your projects
tags: html, css
---

Hello!
I made a template with pure CSS and HTML to showcase any of your projects. Check it out on codepen! 

{% codepen https://codepen.io/Pixmy/pen/JQbRPJ %}

If you want a Tutorial on how to make this type of intros let me know!
How to manage multiple project in VS Code
Tags: vscode, tutorial, productivity, discuss
Published: 2019-06-19 15:35:25

---
title: How to manage multiple project in VS Code
published: true
description: 
tags: #vscode,#tutorial,#productivity,#discuss
---
I have been working as a frontend engineer for over a year now and I know it's quite hard to manage multiple projects. You never know when you have to fix bugs on the project you did months ago. 

So, instead of looking for the project folder on your drive, VScode has an awesome extension called [Project Manager](https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager). This has helped me a lot to quickly switch between projects.


What are you frequently used VScode extensions?
My first ETL in Python
Tags: help, python
Published: 2019-06-19 15:34:07

I’ve only used Python for exploring and manipulating data with Pandas. I’ve taken on a project where we are doing some data transformations in Node, and now the data and complexity have grown to a point where it makes more sense to schedule a Python job to take over. 

I need two kinds of help. 

First, I’d like to find a community recommended course, paid or free, to level up my basic Python skills. 

Second, the list of Python libraries is just awesome, and I don’t know which ones will be most useful. I’m collecting data from three different types of sources, SQL, Mongo, and some JSON from Stripe. After transformation, the data is going into Mongo via GridFS. Also, some of the datasets are very large, so working with everything in memory at once is going to be a challenge. Previously I’ve dumped data into CSVs and read those into Pandas, but there are so many things in this landscape that I’m unaware of, I’m certain there’s a better way. 

Thanks in advance!
Graceful Shutdown Is A Lie
Tags: theory
Published: 2019-06-19 13:12:15

---
title: Graceful Shutdown Is A Lie
published: true
description: Your backends could crash at any time. Code defensively!
tags: theory
series: Blog-A-Day in June
---

If you're writing backend code, you should always assume that your service is going to crash. 💥

This was something I learned when I was designing reliable code that was performing (effectively) a transaction using [Megastore](https://ai.google/research/pubs/pub36971). This service needed to be live, always: our failure cases were that it crashed, or we were upgrading the binary.

This is fairly understood for webservers, where e.g. a Node server can be shut down only by Ctrl-C, or a Go server can only "fail":

```go
func main() {
  http.Handle("/foo", fooHandler)
  log.Fatal(http.ListenAndServe(":8080", nil))
}
```

But it's less clear what a crash means _while_ performing some operation, like database or file operations. When can your server crash awkwardly?

* when you're writing a file to disk over a previous file: for a time, _neither_ file will exist

  * ... solve with writing a temporary file and replacing the previous one

* updating an aggregate count (e.g., when you insert a row, add one to the 'total'): if the second operation fails

  * ... solve with database transactions

* marking an email as being sent: what if the database fails?

  * ... sending a second email is probably fine ¯\\\_(ツ)\_/¯

In all these cases, it pays to code defensively. This isn't a long post, but just something to think about: at what point could the power 🔌 be unplugged from your provider? What's the risk?

# Thanks!

19 👋
Keyboard Automation to the Extreme
Tags: automation, autohotkey, luamacros
Published: 2019-06-19 15:24:13

---
title: Keyboard Automation to the Extreme
published: true
description:
cover_image: https://cdn.pixabay.com/photo/2017/11/09/15/24/keyboard-2933849_960_720.jpg
tags: automation, autohotkey, luamacros
---
For those that share the same passion for making our computers work for us by any means necessary, one tool you'll need for that job is AutoHotkey.

While I could write a long post about the wonders of AHK, that’s not why I’m here. I wanted to share with you an incredibly powerful multi-keyboard setup. I personally cannot take credit for most of this, but we all have our own implementations.

Here’s the gist, I have 4 keyboards hooked up to my desktop. 1 primary and 3 extras for hotkey mapping. This is made possible by using LuaMacros and [AutoHotkey](https://www.autohotkey.com/). I have a full set of [instructions here](https://paper.dropbox.com/doc/Multi-Keyboard-Setup-B1n9J3ll7QBIczL9cJLVr), but I’ll give a brief summary of what’s going on. Here’s a quick visual.

![flow](https://thepracticaldev.s3.amazonaws.com/i/kcvtac241qw514y12vdh.png)

I’ll talk about my gamepad keyboard first. I don’t use it for gaming, but rather dedicated Visual Studio key maps. This gamepad has three profiles and each profile has 14 keys. I use the first profile for basic Visual Studio shortcuts like build, re-build, format document etc., 5 are dedicated to just applying layouts. I use another profile for launching solutions.

My second full sized keyboard is primarily used for launching things (applications, docs, files, you name it). For example, if I want to launch or show the Slack window, I just simply push the S key on that keyboard. 

But what if I want to launch or show the Slack window on a specific workspace? Well, it can actually interrupt key chords as well! So, S+1 will Show or launch Slack, then switch to the first workspace. S+2 will do the same for the second workspace. I can even add more keys to target a specific DM or Channel!

I also work with remote desktops quite frequently so, R+(1-9) will launch a saved remote desktop session.

The last keyboard I use is for manipulation of windows, files, text on the screen and more. Some quick examples here are: I tend to lose track of my mouse sometimes with having three monitors. And rather than going looking for it or shaking it like a monkey, I can push 1, 2, or 3 and the mouse will move to the center of the respective monitor. 

Pushing S+D will sort my Downloads directory into sub directories of like files and remove stagnant ones. 

S+U, S+L, and S+T  will uppercase, lowercase, or title case the current selected string, respectively.

And a whole lot more! I hope you got something out of this!

[Here's a good video](https://www.youtube.com/watch?v=Arn8ExQ2Gjg) of someone doing the same thing, though slightly different.
3 resources for the student developer
Tags: codenewbie, programming, intro, beginners
Published: 2019-06-19 15:21:39

Learning a new language is easy, but using it is a different story. As a full-time, engineering student, submerging myself in Ruby (and now Javascript) has been a given due to the structure that Flatiron provides.

But using these languages to program continues to be fraught with random error, bugs, and confusion around why we do certain things and in which order, as well overall difficulty visualizing what is going on behind the scenes.

Fortunately, I was able to diagnose my frustrations and issue the relevant prescriptions. But too often people default to largest resources
- Google
- Stack Overflow
- MDN/W3

not realizing that as a beginner, the languages the writers use can lead you further into a blackhole of confusion and turmoil.

Fortunately, a lifetime of problem solving has taught me how to learn what to learn. That means:
1. Isolating the issue
2. Understanding the barrier
3. Mark the relationships

So unlike most intro to programming articles, I won't give you the same resources that people usually offer and expect you to figure out how to make the best uses of them.

###1. Videos– specifically YouTube
There are lot of great Youtubers that create programming videos. Some are great, some are terrible, and some are perfect for ***you***.

Finding someone who speaks your learn language is a matter of trial and error. But below I've included a playlist of my favorite instructors in each:

- [Intro to Rails] (https://www.youtube.com/playlist?list=PLmfGSTDbvdnaPdr5e2ihINxl7Ee9QoVkc)


- [Intro to JavaScript] (https://www.youtube.com/playlist?list=PLmfGSTDbvdnacO0_lWne912GWSV8HYNyv)

###2. Code repositories
Some people are just code ninjas. Their code is clean, effective and most importantly, easy to follow. I won't link to any here (since I haven't gotten the permission, but whenever I come across a developer whose code fits these criteria, I make sure to bookmark them for future reference.

###3. Sandbox
I'm a self-proclaimed curator of Apps. So I pride myself on having a toolkit of apps that fulfill their best application. When it comes to sandboxes, all are not created equal, and all do serve the best function.

My 3 favorite apps to test code are:

- [Repl](https://repl.it/@jasterix) - Great for writing standalone code in most languages. I've used it with Javascript, Python and Ruby to great effect
- [Codepen](https://codepen.io/jasterix/) - Great for create or testing front end snippets. If HTML matters, default to Codepen
- Python Tutor's [Visualize tool](http://pythontutor.com/visualize.html#mode=edit) - Is your code breaking or giving you an unexpected results, isolate the issue by using this tool to visualize each step in your function. Python Tutor also has tutors on the website that can take a look at your code and/or explain why it doesn't work



These are thing I've observed over my last 7 weeks at Flatiron. Over the next 7 weeks, I will undoubtedly have new or additional resources for my most pressing needs. In the meantime though, I hope this will make a difference on your journey.
what other social media are you on?
Tags: social, discuss
Published: 2019-06-19 15:20:56

---
title: what other social media are you on? 
published: true
description: I know we all use different social media platforms, what ones are you on? 
tags: social, discuss
---

I’m on a few myself. I use instagram and I have multiples accounts. Codefiend for my coding stuff, and campingdodo for my camp/bushcraft interest. 

For Twitter I just created a new one for my love of being a dad and also for fostering. It’s dadbydesign1. 

What are yours? What do you use each one for?
Was there a moment when you knew programming was the right career for you?
Tags: discuss, career
Published: 2019-06-19 15:19:33

---
title: Was there a moment when you knew programming was the right career for you?
published: true
description: Discuss impactful moment when you decided software engineering was your career path. 
tags: discuss,career 
---

Was there a particular instance that influenced you to choose software engineering as your career? Was there one moment in time or did it happen over time?  

*My impactful moment happened at Cape Canaveral, FL after the Apollo 11 space launch. My dad took me to see the spent launchpad. He had been part of team responsible for the successful launch having designed the gantry supports. It was clear he was in awe of what had been accomplished there. I told him I wanted to be an engineer, too. He told me I could do anything I wanted and he was sure I would make him proud.*
What are some tips for working as a remote developer with children at home?
Tags: discuss, productivity
Published: 2019-06-19 15:11:16

---
title: What are some tips for working as a remote developer with children at home?
published: true
description: Looking for tips 
tags: discuss, productivity
---

Hi everyone!

I've been working remote for a little over a year and a half now. It's been great and don't think I can go back to working in an office full-time.

However, we've added a little one to our family and he's now a month old. My wife has started running errands where she is gone only a few hours - and I've stayed at home with the baby boy. He's pretty good overall, sleeping most of the time. But when he's crying - there is no way to possibly work.

My wife will be going to work full-time at an office so I'm coming to you for some tips! Because I can only imagine as he grows up, my eyes will have to be on him 24/7.

How do you balance working remotely and looking after a baby/kids?
Is GraphQL the future of APIs?
Tags: graphql, webdev, discuss
Published: 2019-06-19 14:56:29

---
title: Is GraphQL the future of APIs?
published: true
description: Graphs are everywhere! What are the main benefits of the data graph structure? Is GraphQL the future of APIs?
tags: graphql,webdev,meta,discuss
cover_image: https://thepracticaldev.s3.amazonaws.com/i/y91mqe0o8wy5y1u6xmeo.png
canonical_url: https://blog.graphqleditor.com/is-graphql-future-of-api/
---

Developing APIs has always been a crucial task for any project. A well-designed API must be flexible and scalable as it always evolves with time. The urge for improvements led to the explosive growth of the data graphs popularity in the last years. This is great news for GraphQL as a lot of companies have started adopting it in their projects. To not be groundless:

- **Audi's e-tron car** with a data graph
- The front page of **NY Times** is based on a data graph
- **Airbnb** uses data graph across all their apps both web & mobile

... the list goes on and on.


### The benefits of data graph

Graphs are everywhere! So what are the main benefits of the data graph structure? First of all, it provides easier access to the date, by better, more clear structure.

![Graphs are everywhere](https://thepracticaldev.s3.amazonaws.com/i/3ilvrt7tf3ge8xcr7gx9.jpg)

This leads to another huge benefit of using data graphs which is a better data understanding which effect in faster project onboarding and more efficient collaborations overall as we can clearly see a cause-effect relation. It's worth mentioning that graph structures are a lot easier to visualize, especially with modern tooling available on the **data graph/GraphQL** market like [GraphQL Birdseye](https://github.com/Novvum/graphql-birdseye) or [GraphQL Editor](https://graphqleditor.com/).

[![GraphQL schema visualized with GraphQL Editor](https://raw.githubusercontent.com/slothking-online/graphql-editor/master/assets/design_schema.gif)](https://graphqleditor.com/)


The benefits don’t stop there and go further beyond to faster development, higher code automation, more consistent user experiences across multiple apps and a lot more.

### A bright future


There is no doubt that people in [Apollo](https://www.apollographql.com/), the most popular GraphQL implementation, fully understand the benefits of the data graph structure. Fortunately, more and more people start to see qualities offered by data graphs. Recently, the big news has seen the daylight, the information that ["Apollo raised $22 million"](https://www.businesswire.com/news/home/20190612005247/en/Apollo-Raises-22-Million-Give-GraphQL-based-Data), this shows that also VCs' noticed a business opportunity in GraphQL technology which gives more confidence that GraphQL might be the future of APIs. What do you think?

![Apollo raised $22 milion](https://thepracticaldev.s3.amazonaws.com/i/ml7clt2tvni3eld3lu3n.png)
What music are you coding to? 
Tags: discuss
Published: 2019-06-19 14:44:12

Leaving aside the debate about whether you should have headphones on or make yourself approachable, what music have you been listening to this week (or in general) to get into Flow? 

I'm a huge fan of The American Dollar, in particular 'music for focus and creativity' and 'music for chilling out'.

There's  a great album by Eluvium called 'False readings on' too. They also have an album called 'shuffle drones' for when you just need some white noise.

Also love the 'Deep Focus' play list on Spotify.

On the heavier side I'm loving the new architects album for when I'm in a furious mood post meetings :)
#DelightfulDocs: DigitalOcean's UX and Microcopy
Tags: ux, writing, digitalocean
Published: 2019-06-19 14:43:23

---
title: #DelightfulDocs: DigitalOcean's UX and Microcopy
published: true
description: 
tags: #ux, #writing, #digitalocean 

---

What started as a UX writing and microcopy case study turned into a love letter to DigitalOcean 😁

{% youtube s6jB7x87ORo %}

In this video, I share my favorite elements of DigitalOcean's UX and microcopy: 

- Onboarding processes 
- Empty States 
- Success and confirmation messages 
- Tooltips
Automatic Login in a Django Application Using External Authentication
Tags: django, authentication, python, ldap
Published: 2019-06-19 14:40:10

**Django is one of the most famous Python frameworks. In this tutorial, I explain how to automatically log in users in its built-in admin interface using an LDAP.**

Django provides a very useful admin interface that permits to manage users, display and modify model data. But have you ever tried to integrate a Django application in a big company?

I have and, most of the time, they already have an authentication system to authenticate their users. For example, 95% of future 1000 companies use Active Directory from Microsoft to manage their users.

Therefore, the users are authenticated all over the network and **there is no point adding the Django Admin login page with custom credentials**. Not to mention the company security department that would probably not accept a different credential database.

**Let’s see how we can automatically log in users with a concrete example**👇
https://medium.com/sipios/automatic-login-django-ldap-authentication-tutorial-91cbb9d5bf71
Libra - Facebook's Cryptocurrency will be in use by 2020
Tags: libra, facebookcoin
Published: 2019-06-19 12:51:24

---
title: Libra - Facebook's Cryptocurrency will be in use by 2020
published: true
description: Here let us discuss some important aspects about facebook coin libra.
tags: libra, facebookcoin
---

##1. Libra - What is It?

Libra is a cryptocurrency built by Facebook and powered by a new Facebook-created version of blockchain. According to Facebook, Libra is a " global currency and financial infrastructure".
Libra will be available for use in 2020 and allows Facebook users for financial transactions across the world. A Libra is a unit of the Libra cryptocurrency and its denoted by $ whose value meant to stay stable, as like stablecoins.

##2. Why Facebook launches libra?

The two keen points behind the launch of Libra - A New Cryptocurrency by Facebook is as follows:
1. To overcome regulatory hurdles and antitrust concerns about Facebook.
2. To reach 1.7 billion people who don't have a bank account and can make use of their Facebook account to process global transactions.

##3. Executive Authority of Libra 

The digital currency, Libra will be serviced by “Libra Association”, an independent, non-profit organization in Switzerland. Its two main functions are 
1.  To validate the transactions on the Libra blockchain network.
2. To manage the reserve Libra to allocate funds to social causes.
Libra Association Council will be a governing body inside Libra Association who will vote for policy and operating decisions.
Libra Association will withdraw its leadership role once the currency is launched in 2020 and every member of the association will have equal rights to votes in the governance of Libra.

##4. Libra - How can we buy and use it?

Facebook doesn't mention in details about how the currency will be available at launch but looks like it follows a hybrid approach.
Calibra is a digital wallet of facebook cryptocurrency libra used to store the libra currency. This will users to send it to anyone with a smartphone. This calibra wallet usage will be available in Messenger, WhatsApp, and as a standalone app. Calibra will offer an expedited way of paying merchants through the scan of QR code.
[Get more Info about Libra here at Bitdeal .](https://www.bitdeal.net/what-is-facebook-libra)
Byte Sized: A Taste of Coding History (Coming soon!)
Tags: computerscience, history, showdev
Published: 2019-06-19 14:35:33

---
title: Byte Sized: A Taste of Coding History (Coming soon!)
published: true
description:
tags: computerscience, history, showdev
---

On **June 26th**, we will be launching the first episode of this new series!

Follow **Byte Sized** for all the episodes!

{% organization bytesized %}
Wrap a JavaScript function without changing its name/properties (by sindresorhus)
Tags: node, javascript, functional
Published: 2019-06-19 14:32:53

---
title: Wrap a JavaScript function without changing its name/properties (by sindresorhus)
published: true
description: Wrap a JavaScript function without changing its name/properties (by sindresorhus)
tags: [nodejs, javascript, functional]
---

Wrapping a JavaScript function is not as simple as one might think. Some of the issues you might encounter include:
  - keeping the original function `name`
  - keeping the original function static properties and inherited properties
  - showing the original function's body when using `String(function)`

`mimic-fn` is a small utility by sindresorhus tackling this issue.

https://github.com/sindresorhus/mimic-fn