teleren/devto huggingface dataset:
100 days of code, meditation and learning a new language!
Tags: 100daysofcode, 100daysofmeditation, 100daysoflearning
Published: 2020-04-28 10:51:14

Hi guys,

If you're interested, follow me on Twitter to see my journey of 100 days of coding, meditating and learning a new language!

https://twitter.com/santiagoMcepeda/status/1254896795190202368
Git & GitHub: Installation and Configuration
Tags: github, git, beginners
Published: 2020-04-28 10:47:37


> 
I am a big fan of git and GitHub, but familiarizing with the tools is not an easy task without practice. I had to google articles for installation and configuring git and GitHub on my laptop. So after getting it all right, I decided to write about it. I probably will refer to this article when installing git again. LOL

## Installing git

[Install git from here](https://git-scm.com/downloads)
Choose a selection based on your operating system.
For Linux and Ubuntu OS, you may use this alternative:
Open your terminal and paste the command below:
```shell
sudo apt install git-all
```

## Configure git with your GitHub Account
Ensure you have a GitHub account. If not, create one here [Join GitHub](https://github.com/join).

First of all, we’ll configure your details to git.
“Assuming your GitHub username is DevAcc and the email used on GitHub is devacc@mail.com”
On your terminal, use the following commands:
```shell
$ git config --global user.name "devAcc"
$ git config --global user.email “devacc@mail.com”
```

To confirm the details use  ``` git config --list ```
With that set, you should be ready to start working efficiently with your local repository.

## Generating a git ssh key
This prevents git from requesting your username and password every time you push into GitHub. (it’s annoying)
So this is how we do it:

Open your terminal and use the commands below:
```shell
ssh-keygen -t rsa -b 4096 -C "devacc@mail.com"
```
This will prompt you to enter a location to save the key and also create a password like a key to access that.

## Connecting to Your GitHub Account

After this, you’ll need to copy the key to the clipboard.
Use the command below to view the ssh key in a human readable format:

```shell
cat < ~/.ssh/id_rsa.pub
```

Copy the key displayed to your clipboard.

Go to your GitHub profile and navigate to settings: https://github.com/settings/profile
On the left side panel click on SSH and GPG keys, then click on the top green button “New SSH” and paste the key there.
Voila! You are good to go

[My Profile](http://chrisachinga.me)
please how to do nested_attribute and field_for in django like in ruby on rails.
Tags: django
Published: 2020-04-28 10:38:31

---
title: please how to do nested_attribute and field_for in django like in ruby on rails.
published: true
description: Hello, I am familiar with ruby and rails. I learned the basics of python and django and I want to do some stuff in django like saving data to two different tables at the same time with a single form on the page like I do in ruby on rails with nested_attribute and field_for. Please how do we do that. Also how to send a javascript response to the browser as I do in rails with respond_to do | format | . Thank you.
tags: Django
---

Hello, I am familiar with ruby and rails. I learned the basics of python and django and I want to do some stuff in django like saving data to two different tables at the same time with a single form on the page like I do in ruby on rails with nested_attribute and field_for. Please how do we do that. Also how to send a javascript response to the browser as I do in rails with respond_to do | format | . Thank you.
Launching Code Time 2.0 🚀
Tags: vscode, productivity, showdev
Published: 2020-04-28 10:37:50

We’re super excited to announce the launch of the next version of [Code Time](https://www.software.com/code-time). Code Time provides automatic time tracking and coding metrics that help you improve—all for free. You can check us out on [Product Hunt](https://www.producthunt.com/posts/code-time-2-0). 

We’ve added tons of new features to help developers level up faster. So, how can you use Code Time to become a better developer? 

## Level up faster 

Here’s what you can do with Code Time 2.0: 

💪 **Set daily coding goals**. We make it easy to track your progress and reach your goals. Set custom code time and code start time goals each day. 

![Code Time goals](https://dev-to-uploads.s3.amazonaws.com/i/zshnqy0050yf4yc2fak0.png)

💻 **Stay on track.** Build your coding profile and track your active code time each day. Not all development tasks—like debugging or reviewing code—require active coding. Code Time now also tracks your total code time, so you can see your total time spent focused in your code editor or IDE each day. 

![Weekly code time](https://dev-to-uploads.s3.amazonaws.com/i/lt8dsejq1vw9g94nirjz.png)

📅 **Protect your code time.** Link your Google Calendar to your Software account to visualize your coding sessions and protect code time from meetings.

![Protect code time](https://dev-to-uploads.s3.amazonaws.com/i/3glpu0b7isanxcql488e.png)

📊 **See all of your stats in your editor.** Keep your coding data at your fingertips with the new Code Time panel right in your code editor. You’ll have quick access to your activity metrics like code time, active code time, velocity, and commits—including your daily averages for each. 

![Code Time editor](https://dev-to-uploads.s3.amazonaws.com/i/5mwvb9b5oq7q5csh53mc.png)

📬 **Revamped weekly email reports.** We’ve redesigned our weekly email reports to send you a summary of your coding activity, top projects, and more—straight to your inbox. 

🌙 **Sleek new dark theme.** Our web app now lets you switch between light and dark themes, so you can check your coding stats with style.

## Getting started

Getting started is as easy as installing an extension for your code editor. Code Time works with [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=softwaredotcom.swdc-vscode), [Atom](https://atom.io/packages/code-time), [IntelliJ](https://plugins.jetbrains.com/plugin/10687-code-time), and many other editors and IDEs. You can find your editor [here](https://www.software.com/code-time).

It’s totally free to use. Try it out, give us feedback, or see more on [Product Hunt](https://www.producthunt.com/posts/code-time-2-0). 

Have an idea for 3.0? Let us know what you'd like to see next.
What's one thing you wish you had known before you started your career in web development?
Tags: discuss, webdev, codenewbie
Published: 2020-04-28 10:37:44

---
title: What's one thing you wish you had known before you started your career in web development? 
published: true
description: Help newbies by sharing your experience and the one thing you wish you had known before you started your career in web development?
tags: discuss, webdev, codenewbie
cover_image: https://i.imgur.com/b9smhKF.png
---

### What's one thing you wish you had known before you started your career in web development? 

For me, it was just picking one topic and focusing rather than try to learn everything. 🧠

I'd love to collect some answers for a blog post people just starting out or feeling a little bit lost. 

If you would like your twitter or anything linked to the advice add it after your comment. 🐦
How to use dynamic router in Next.js?
Tags: react, nextjs
Published: 2020-04-28 10:32:30

Before that, I used the next-routes library and prescribed routes like this:

const routes = require('next-routes')
module.exports = routes()
  .add({ name: 'article_detail', pattern: '/:categoty_name/:article_slug', page: 'article_detail' })


Now the developers are Next.js is said to support dynamic routes by default

Question. How to use new routes with transition. That is, if I had a category/link to an article, how do I now specify this in the pages folder?
They offer the /post/first-post option
In other words, create a post folder and then the file [..slug]
What should I do in my version?
Calling Front-end Ninjas
Tags: frontendhiring, uiengineer, vuejsopening, frontenddeveloper
Published: 2020-04-28 10:29:35

VideoKen is looking for a Front-end Developer who is motivated to combine the art of design with the art of programming.

Responsibilities will include translation of the UI/UX design wireframes to actual code that will produce visual elements of the application. A team player, who can also work independently, escalating issues when appropriate. We’re a fluid team that works well together and can take constructive criticism in the spirit of improving software quality. 

VideoKen’s patented AI-powered video discovery, indexing, engagement and analytics platform is used by 30+ customers across the world. Come join us to change the way the world watches informational videos. 

Interested? Reach out to us at the link below.
https://angel.co/company/videoken/jobs/806176-front-end-javascript-html-css-developer
Effective Refactoring
Tags: refactorit, codequality, testing
Published: 2020-04-28 10:22:23

When you start working on some existing code, sooner or later you are going to bump into a situation where you have to refactor some part of that code. There can be many motivations behind that refactor. Maybe the code is too complex to maintain, maybe the code is doing just way too much and so on. So here are some quick tips regarding refactoring that code effectively.

**1. Write unit tests**
Before you even think about changing that code, you have to make sure that you have written all the unit tests you need in order to refactor that code. These tests will ensure that you've refactored the code while maintaining the existing behaviour and you've not introduced new bugs while changing the code. Make sure you've written test cases to cover all branches (if-else, switch etc.) of the code.

**2. Break it down**
If the code in question is doing too many tasks i.e. fetching data, parsing data, doing computation on it, transforming the result etc., you need to break this code into several functions each doing a single task. This way you'll make your refactor more complaint to the notion of the [single responsibility principle](https://en.wikipedia.org/wiki/Single-responsibility_principle). Make sure you also write some more unit tests to test these new functions as well.

**3. Touch base with original author(s)**
If you have the original authors of that code still around, you can ask them to review your code. It is much easier for them to recall the intricate details about that code and scenarios they handled. They may tell you about some additional scenarios you should have considered while refactoring. Make them the reviewer of the PR for this refactor or get in touch with them in person, whatever floats your boat. If the original author(s) are not around, you can still ask other developers to review your refactored code so as to weed out code smells and things that look off.

That's it for today. I build [CourseLit](https://codelit.github.io/courselit/) and teach software development on [YouTube](https://www.youtube.com/channel/UCUmQhjjF9bsIaVDJUHSIIKw).
Run shell commands from Vim & even get the output of the command back into Vim (Video)
Tags: vim, tutorial, terminal, bash
Published: 2020-04-28 10:19:32

## New Video Series
I am creating a new (hopefully fun/energetic) YouTube series about Vim Tips. In particular small easily consumable Tips & Tricks in Vim to help you become a better Vim-er. This series is for Beginners & Intermediate Vim users alike and will hopefully expose/highlight some of Vim's massive (maybe even lesser known) functionality with explanations & examples.

The main aim of this series is to help people learn about the POWER that Vim gives you, which more often than not is somewhat difficult to find on your own, so this series is about pointing out that (& more) functionality...


## This Video
This first video is (as the title says) about how to trigger Shell (bash/sh terminal commands) from within the comfort of Vim without having to exit the program or which to a different window or put Vim into the background. This video will even show you the very powerful functionality that lets you run a command and bring the output of the command right back into the Vim editor (for example running the ls command and bringing the results into the file you are editing).

I hope you enjoy this video, please let me know if you do and if you would want more of it...


## The Video
{% youtube dVIP72Uwt2A%}


## Onwards
If you have ANY feedback or questions at all please let me know in the comments below or reach out to me on twitter:

[My Twitter (@ben_kadel)](https://twitter.com/ben_kadel)

Or if you want to see more videos from my channel then here you go:

[My Youtube Channel](https://youtube.com/BenKadel)


Thanks for reading and possibly watching!
How to learn!
Tags: softwaredevelopment, developer, bugs, career
Published: 2020-04-28 10:18:02

---
layout: post
title: How to learn!
description: random thoughts on fear of breaking things in software development
author: bitsmonkey
tags: softwaredevelopment, developer, bugs, career
---
Break Things! Don't take this literally it might cost your job :).

In Software Development these words are expensive and never will you hear from the management. Well one thing I learned from years of experience is that 

_I only learn when I break things_.

The fear of breaking functionality or feature has always kept you from learning. There are many ways to cultivate this habit and keep your job.

## Hello World!

Now when you learn anything you start with Hello World!. By following the instructions, you have created something new. But you have not _learnt_ it yet.

To learn you need to Break!. Now skip one of the steps from the instructions and see the errors that you get and follow the same by skipping the steps one by one you choose.

Now instead of only seeing the Hello World! printed out you would have seen enough errors that likely you would see in the real world as well.

## Real World!

This is where the _fear_ seeps in!. Here usually we fear to even fix something assuming it breaks somewhere else.

There is no ideal code in this world once any software has gone from being a teenager. Everyone expects the code to behave,

as the social barriers have formed and the reputation takes over.

One way to learn from these huge systems is by going through code some else has written this is the best way to learn. Never complain about anyone's code, it might not always be a lack of knowledge there are a thousand factors that could have evolved to what it has become now. The top factor is Time given to complete a feature or bug.

So, in this case, another way to learn is to complete the given task of bug/feature and then work on a different experiment branch and see what are the things that you would do better. try it out there, this where we are allowed to think outside the box. If all goes well get that back to your feature branch.

Now do not fear for the bugs, even if it appears in production follow the same process and repeat. Until you have your experiment branches its only the surface you know. experiment branches allow you to dig deeper into the monster's mind.

_Fear is a good thing when time is not your side!_

_To learn, Experiment!_

*Photo by Bill Oxford on Unsplash*

_Originally Posted on [Bitsmonkey Blog](http://bitsmonkey.in/blog/2020/04/28/break-things)_
RabbitMQ Basics
Tags: rabbitmq
Published: 2020-04-28 10:12:08


We need to prepare to scale up our web apps and do the time consuming jobs asynchronously in a stable way. Queue is a good tool to fulfill this requirement.

RabbitMQ fits our needs after investigation, so we try to add it into our apps. 

Some terms need to mention:

**producer**: A program that sends messages

**consumer**: A program that mostly waits to receive messages.

**queue**:  A buffer that stores messages. It is like a mailbox. Although messages flow through RabbitMQ and your applications, they can be stored only inside a queue. A queue can store as many messages as you like ‒ it's essentially an infinite buffer. Many producers can send messages that go to one queue, many consumers can try to receive data from one queue. 
In RabbitMQ a message can never be sent directly to the queue, it always needs to go through an exchange. 

**exchange**: It receives messages from producers and it pushes them to queues.

exchange types: direct, topic, headers and fanout.

**Note**:

 - Declare a queue to make sure it exists before using it.

 - If we send a message to non-existing location, RabbitMQ will just trash the message. 

 - Before exiting the program we need to make sure the network buffers were flushed and our message was actually delivered to RabbitMQ. We can do it by gently closing the connection.


It is highly recommended to read through the [official tutorial](https://www.rabbitmq.com/getstarted.html)

Here is an example making use of the routing example and also enable fair dispatch for multiple workers.

![](https://www.chuanjin.me/images/pika.png)
![](https://www.chuanjin.me/images/rabbit.png)
Ya!Meeting On-Demand Jitsi Meet Private Servers for Videoconferences
Tags: showdev, sideprojects
Published: 2020-04-28 09:53:07

I love [Jitsi Meet](https://jitsi.org/jitsi-meet/) and roughly one year ago I decided to kick off a new side project that allowed me to launch my own private servers, on-demand, for every videoconference meeting with my clients, friends, and team.

The application it's called [Ya!Meeting](https://www.yameeting.com/) and it's an orchestration service that launches and installs Jitsi Meet on a new VM on the cloud, and when the meeting is over the server gets deleted.

It's quite easy to create a new meeting, you type in the name of the meeting, choose how many participants (to determine the size of the VM), the duration (to schedule the termination time), the location of the attendees (to deploy the VM in a specific region) and the email address of the attendees to notify them with the date, time and link to the meeting.

You can read more about it in the [FAQ section](https://www.yameeting.com/#faq)

The cost for a meeting is quite low, for ex.: Up to 6 people, for 3 hours is just **USD 0.06**

I also offer a free meeting just like [Jitsi Meet](https://meet.jit.si/) but the server running this free meeting gets deleted and replaced by a new one at least once a week.

I'm currently working on allowing the users to deploy on their own cloud accounts like Digital Ocean, AWS, GCP, Azure and provide their own SSL certificate.

Critics and comments are needed. Don't be shy

*Photo Credits: [https://www.pexels.com/@julia-m-cameron](https://www.pexels.com/@julia-m-cameron)*
--save and --save-dev : Why You Should know The Difference
Tags: npm, javascript, devops, react
Published: 2020-04-28 09:49:13

We all have been rooky at almost everything at some point in our life, being a developer has not been an exception. 
![Gif emotional](https://media.giphy.com/media/riGzWt6jfxJ3a/giphy.gif)

As a newbie, we all make mistakes and overlook things because either they look simple or overly complex. While this ignorance does not cause any major embarrassment in our *devlife* (hopefully), sometimes somethings are worth paying attention to.

Like the difference between --save and --save-dev while installing package through NPM.

![gif thinking](https://media.giphy.com/media/TPl5N4Ci49ZQY/giphy.gif)

# What do they do anyway?
Every node project has a file called __package.json__ that contains the details about the packages installed in the current project directory and alias for commands to start, build the project. Other than that it also contains two json objects that are of our interest in this blog post. __dependencies__ and __dev-dependencies__.

## What are dependencies?
These are the packages that are required for the application to work properly. For example, You need react-dom to run a react project. 

![gif duh](https://media.giphy.com/media/QmJr6ewZqfQvC/giphy.gif)

## Then what are dev-dependencies?
These are the packages that you need while developing the project but not when deploying the project. These packages are not built when the project is deployed. Example: A package for instant-server for quick rerendering of a web page being developed.

![gif got it](https://media.giphy.com/media/l1KddbhbMNYpZzfDW/giphy.gif)


## What does --save and --save-dev do?
Well, You already know the answer now, don't you?
> --save saves the name and version of the package being installed in the dependency object.

> --save-dev saves the name and version of the package being installed in the dev-dependency object.

As developers who are just getting started or want to build an application that can be easily deployed without any problem this difference is a must know.

Or else this is how you'll find yourself
![gif frustrated](https://media.giphy.com/media/uDRezGbZW1uo0/giphy.gif)

That's all in today post. I'll see you in the next one.

Cheers,
Jha

## Some of my other posts that you may like
{% post https://dev.to/jha/7-tricks-to-get-more-done-as-a-developer-35k9 %}
{% post https://dev.to/jha/why-learn-docker-2691 %}

## I also write on Medium
{% medium https://medium.com/@amit.jha6700/series-announcement-3aee57a44746 %}
GraphQL Centaur CLI on Product Hunt
Tags: graphql, typescript, opensource, showdev
Published: 2020-04-28 09:37:07

---
title: GraphQL Centaur CLI on Product Hunt
published: true
description: We have just launched our new open-source product on Product Hunt & I would like to ask you for a support 😊
tags: graphql,typescript,opensource,showdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/r7tqzokusgr5fxcyazo0.png
---


Hello, fellow Devs!

We have just launched our new open-source product on Product Hunt.
This time it's a **[GraphQL Centaur CLI](https://www.producthunt.com/posts/graphql-centaur-cli)** which basically allows to bootstrap backend applications build with GraphQL and generate basic functions like CRUD.

>*GraphQL Centaur is a CLI tool with a goal to provide seamless experience 
> creating GraphQL as a service. How does it work?*
>
>✅ *takes any given GraphQL schema as input*
>✅ *generates Mongo/Stucco-js database resolvers in TypeScript*
>✅ *allows you to customize them the way that suits your project*

All that to make the process of creating your GraphQL based backend more enjoyable!

[![Upvote on Product Hunt](https://dev-to-uploads.s3.amazonaws.com/i/9k55r9fnlvci08svml9g.png)](https://www.producthunt.com/posts/graphql-centaur-cli)

I would like to ask you to share your thoughts about it & would appreciate any form of support like feedback or up-votes. We know that there is still a lot of space for the improvements for GraphQL Centaur! Thank you! 

![GraphQL Centaur CLI](https://dev-to-uploads.s3.amazonaws.com/i/8srbqdzqgxpwjt2inmmj.gif)

## Resolver generation

First time when you generate a resolver centaur will also generate needed libraries for collections, DB, Utils and [graphql-zeus](https://github.com/graphql-editor/graphql-zeus) definitions, then given the following schema:

```tsx
type Person{
    firstName: String!
}
type Query{
    people: [Person]!
}
schema{
    query: Query
}
```

after choosing the following elements:

- `Query`
- `people`
- `CRUD`
- `listFilter`

GraphQL Centaur should generate TypeScript resolver placed in `$src/Query/people.ts` directory:

```tsx
import { FieldResolveInput, FieldResolveOutput } from "stucco-js";
import { PersonCollection } from "../db/collections";
import { DB } from "../db/mongo";
import { Utils } from "../Utils";
import { Person, ResolverType, ValueTypes } from "../graphql-zeus";

export const handler = async (): Promise<FieldResolveOutput> => {
    const db = await DB();
    const col = await db.collection(PersonCollection);
    return Utils.CursorToGraphQLArray<Person>(
        await col.find({}),
    );
};
```

[![Upvote on Product Hunt](https://dev-to-uploads.s3.amazonaws.com/i/9k55r9fnlvci08svml9g.png)](https://www.producthunt.com/posts/graphql-centaur-cli)

![Thank you!](https://res.cloudinary.com/practicaldev/image/fetch/s--LtHCwktk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://thepracticaldev.s3.amazonaws.com/i/dwvm6j33gul8lpnhcysv.gif)