teleren/devto huggingface dataset:
Becoming a Superhuman In 10 days of Isolation: Day 1
Tags: productivity, webdev, career, 100daysofcode
Published: 2020-09-26 06:51:08

It is funny but I did not report the day 1 on time. I did not complete my part starting from the day 1.

At this moment I dont even know how it is possible to regain your trust, my dear audience of few people whose interest I appreciate a lot.

Basically, I was quite productive the whole first part of the Day 1 and following is the stuff I was able to complete:

- I woke up on time and even before the planned time and had a shower
- Made changes to the technolgy being used for the authentification of one of my websites. I did decide so after having a talk with my fellow programmer friend. 
- Attended a university online lecture of 2 hours and skipped the tutorial session that followed it
- I started my search for Dev community in Hong Kong by asking around in different group chats and people that I even barely know
- I moved forward on my application for an exchange university in one of european countries. Had several questions which I addressed to their coordinators and my own department
- Registered for a social entrepreneurship training with a competition part
- Started my search for part time jobs by asking the people who had experience and turns out I might already be capable for a position
- Did gym

But the sad thing is my productivity flow stopped at around 3 pm and I just was doing something, but that something is not even worth mentioning. So ineffective and irresponsible. 

Will it be a lesson for me? 
Definitely yes. 

Will I learn to be productive for the whole day?
Man, I struggle with it

By the way I wrinting it on the morning of Day 2, so wish me luck with it. 

I decided that I have to state what I will be doing on the next day at the end of each daily report. Here goes the tasks I want to complete by tonight:

- Complete the authentication on my govt website project
	- finalize the technology being used
	- find useful links and documentation
	- search for tutorials
- Wire the admin panel to the database and the website
	- create a simple UI for admin
	- wire the post and delete routes 
- Integrate the tinyMce onto the admin panel
	- read the documentation
	- find the part needed
	- integrate it to the admin panel page
- Launch the news section of the website
	- even if I do not finish the backend part launch news section by todays night
	- get all the last news and publish them on the website
- Start working on my third planned full stack project
	- decide what the project is going to look like 
- Make the current version of CV on overleaf

I will update you tonight on how it went and what I was able to accomplish. I will be a real beast if I am able to finish all the tasks. It will also be a boost for my confidence, so I will do my utmost.

Have a nice Saturday
What activities outside of coding do you spend the most time on?
Tags: webdev, discuss
Published: 2020-09-26 06:27:40

---
title: What activities outside of coding do you spend the most time on?
published: true
description: 
tags: webdev, discuss
cover_image: https://axerosolutions.com/attachment?file=Yc2aYV45S83vD%2BW1s%2BjZMg%3D%3D
---
Taking breaks can help you focus, increase your productivity, and reduce stress. Often in the rush to hit deadlines and complete challenging tasks, we forget that.

What activities outside of coding do you spend the most time on?
Show off your personal landing page
Tags: discuss, landingpage, design
Published: 2020-09-26 06:25:23

I am curious to see how people present themselves online, how does your personal blog/portfolio/landing page look like? 

I am gathering inspiration for updating [mine](https://www.aquicarattino.com). I created it in a couple of minutes just because I needed to get something quick out there and haven't updated it yet and I really don't like how it looks.
What localhost tunnels have you used?
Tags: webdev, discuss, localhost, web
Published: 2020-09-26 06:17:45

---
title: What localhost tunnels have you used?
published: true
description: 
tags: webdev, discuss, localhost, web
cover_image: https://mobile-cuisine.com/wp-content/uploads/2012/05/website-name-e1456929129165.jpg
---
During development, the application runs on our local machine. If you want to make your machine accessible from the outside there are solutions like ngrok.com, localhost.run, localtunnel.me, etc..

Have you ever used some of these and which has been your favorite?
What are the best collaboration tools for remote work?
Tags: webdev, discuss, productivity, remote
Published: 2020-09-26 06:01:52

---
title: What are the best collaboration tools for remote work?
published: true
description: 
tags: webdev, discuss, productivity, remote
cover_image: https://www.ravepubs.com/wp-content/uploads/2020/03/remote-collaboration.png
---
The first ones that come to my mind would be Slack, Google Drive, Trello, Figma and Github.

What are some of the best collaboration tools, that you would recommend for remote work?
What domain extension do you use for portfolio?
Tags: webdev, discuss, portfolio, domain
Published: 2020-09-26 05:51:49

---
title: What domain extension do you use for portfolio?
published: true
description: 
tags: webdev, discuss, portfolio, domain
cover_image: https://www.bannerview.com/os/resources/media/domain-extensions-lrg.jpg
---
Lately I've seen many, such as .dev, .tech, .me, .io, .info and .com. Which one do you use for your portfolio?

Or do you use free subdomains like yoursite.github.io or yoursite.netlify.app?
What's the best VPN service?
Tags: webdev, discuss, security, vpn
Published: 2020-09-26 05:38:08

---
title: What's the best VPN service?
published: true
description: 
tags: webdev, discuss, security, vpn
cover_image: https://thebestvpn.com/wp-content/uploads/2019/03/vpn-devices-640x273-new.jpg
---
A VPN, or virtual private network, is one of the smartest ways to protect your online privacy and maintain your data security.

What VPN services would you recommend that are easy to use, fast and affordable?
3 reasons you should try Svelte
Tags: svelte, webdev, javascript
Published: 2020-09-26 05:34:23

#### **Svelte** a new contender to the war of **JavaScript frameworks**. It might not be as mature as other frameworks like **React** and **Vue**, but here are three reasons you should try **Svelte**:
- The learning curve is pretty small
- It requires less amount of lines & has easy state management.
- It is not a normal framework.


### 1 . Learning curve is pretty small 

If you know **HTML** ,**CSS** & **Javascript**, learning **Svelte** is going to be a breeze. Like **Vue**, **Svelte** templates are a superset of **HTML**.

A  simple **svelte** example :
![img](https://cdn.discordapp.com/attachments/594557132633014272/758130760699609088/Screenshot_20200923-0355582.jpeg)

In first glance everything looks like **HTML** but it is **Svelte**. The **{}** are usually used to insert **Javascript** in **HTML**.

> **Svelte** is  **HTML ,CSS ,Javascript** with many cool add-ons.

If you know only **HTML ,CSS ,Javascript** than give **Svelte** a try. Later **transitioning** to other frameworks will be easy too.



### 2 . It requires less amount of lines & has easy state management.

Let's take an example of a simple counter with **React** & **Svelte** 

###### React :
```
class Timer extends React.Component {
  constructor(props) {
    super(props);
    this.state = { seconds: 0 };
  }

  tick() {
    this.setState(state => ({
      seconds: state.seconds + 1
    }));
  }
  componentDidMount() {
    this.interval = setInterval(() => this.tick(), 1000);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  render() {
    return (
      <div>
        Seconds: {this.state.seconds}
      </div>
    );
  }
}

ReactDOM.render(
  <Timer />,
  document.getElementById('timer-example')
);
```

###### Svelte :


```
<script>
  let seconds = 0;
  setInterval(() => seconds += 1, 1000);
</script>

Seconds: {seconds}

```
> React: 33 lines , 
> Svelte: 6 lines

As seen from above :
- **Svelte** does greater things in  few lines of code.
- **Svelte** 's state management is really simple.



### 3 . It isn't a **normal** framework..


Svelte is pretty different from other frameworks. Svelte **compiles** you code into **vanilla javascript**. Thus the build size of Svelte apps is small. Svelte deserves its reputation because of its speed and developer experience.

### Conclusion :

##### Svelte doesn't have a large community like **Vue** nor is being backed  by any major company like **Angular** & **React**. Svelte is growing constantly but it still is pretty young and new in the market. I had suggested using it for personal projects rather than for job hunting etc.

### Resources 

###### Some cool resources you should definitely check out.
 

- [Official Svelte Site](https://svelte.dev/) 
- [Introduction to Svelte](https://youtu.be/qqt6YxAZoOc) 
- [How Svelte is truely Reactive](https://youtu.be/AdNJ3fydeao) 
- [Svelte vs React vs Angular vs Vue](https://youtu.be/DZyWNS4fVE0)
ClojureScript koan kata destructuring 7
Tags: help, clojure, functional
Published: 2020-09-26 05:09:07

Hello,

I try to learn clojure on [clojure koan](http://clojurescriptkoans.com) and I am stuck on [that one](http://clojurescriptkoans.com/?fbclid=IwAR34NDjI7GVlogAI02WRUBdrZu0HY4oPRiPQ6ZIsFiZEXMUJH_b7xKboINg#destructuring/7)

If you know the answer ?
Invoke your function even before declaring it: Hoisting in JavaScript
Tags: javascript, beginners, webdev
Published: 2020-09-26 04:46:33

# Take a Look
## Example:
```js

add(2, 6); // 8

function add(x,y){
  return x+y;
}
```
- We called the _add_ function even before declaring it. This is possible in JavaScript because of Hoisting feature.
- In **hoisting**, all the declarations are moved to the top of the current scope.
- It is not only applicable to functions but to any other variables.
- We can use any variable even before declaring it. For example:
```js
num1 = 2;
console.log(num1); // 2
var num1;
```
## Hoisting in Action
```js
num1 = 2;
num2 = 6;
add(num1, num2); // 8
var num1;
var num2;
function add(x,y){
  return x+y;
}
```
## _let_ and _const_
```js
num1 = 2;
console.log(num1); // ReferenceError: Cannot access 'num1' before initialization
let num1;
```
- With _let_ and _const_, we cannot use the variable before its declaration. If we try to use, we get _RefrenceError_ as above.
- This is because of hoisting in which the variables declared with _let_ and _const_ are moved to the top and are only declared but not initialized and hence _ReferenceError_.
Music
Tags: music
Published: 2020-09-26 04:36:06

---
title: Music
published: true
description: Spotify fuel for faster fingers.
tags: music
---

Probably mentioned a thousand times on here. Rather than search and read what others have posted I am just going to skip to writing about why music is fuel for me.

In the late nights while bobbing my head up and down listening to UGK and I find the code starts to match the rhythm. Before I know it the prose is mixed in a deeper meaning.

Just function. 
Do the the thing. 
Little fingers keep on typing.

Zap Pow comes in and lights up the room and suddenly that new screen is no longer another thing to do but a groovey new piece of awesomeness sliding it's way into your product.

While you pause and reflect the smooth sounds of Nikolai Rimsky fill the room and the button works. The function is performed and the action taken.

Success.

Celebrate the good times with sounds of Micheal Jackson. Moonwalk your way away from the computer and into a effortless sleep as today your fingers danced along the keyboard to produce a small piece of magic.

Keep on jammin'
How to use GraphQL in WordPress – Best Alternative to Rest API
Tags: graphql, wordpress, javascript, api
Published: 2020-09-26 05:22:42

---
title: How to use GraphQL in WordPress – Best Alternative to Rest API
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/m0fd80c5qyojd5qpv5r9.jpeg
published: true
date: 2020-09-26 04:24:12 UTC
tags: graphql,wordpress,javascript, api
canonical_url: https://rajeshroyal.com/how-to-use-graphql-in-wordpress-best-alternative-to-rest-api/
---

To use GraphQL in WordPress you have to install the **wp-graphql** plugin.

To install this plugin You have to download it from GitHub: [download wp-graphql](https://github.com/wp-graphql/wp-graphql/archive/develop.zip)

If you don’t know how to install a WordPress plugin manually follow this tutorial

#### [Install a Plugin using the WordPress Admin Plugin Upload.](https://www.wpbeginner.com/beginners-guide/step-by-step-guide-to-install-a-wordpress-plugin-for-beginners/)

After Activating this plugin you can visit https://yoursitename.com/graphql to access the GraphQL end-points. Here you can do all the queries and mutation.

If you want to access the GraphQL Playground you have to install this plugin: [download WP-GraphiQL ](https://github.com/wp-graphql/wp-graphiql/archive/master.zip)

#### 

![graphql playground wordpress](https://rajeshroyal.com/wp-content/uploads/2020/09/graphql-playground-wordpress.jpg)<figcaption id="caption-attachment-1346">screenshot of GraphQL Playground for WordPress</figcaption>

sources:

[wp-graphql github](https://github.com/wp-graphql/wp-graphql)

[WP-GraphiQL GitHub](https://github.com/wp-graphql/wp-graphiql)

If you want to read things in very detail: [read here](https://dev.to/leoloso/introducing-the-graphql-api-for-wordpress-38oc)

#### Your Feedbacks are appreciated.😀😀
Choosing a framework.  What if it was your instincts that made the decision?
Tags: python, javascript, ruby, php
Published: 2020-09-26 03:47:19

---
title: Choosing a framework.  What if it was your instincts that made the decision?
published: true
description: 
tags: Python, Javascript, Ruby, PHP
//cover_image: https://direct_url_to_image.jpg
---
  Recently I published a series of posts on the choice I had to make between three backend frameworks.  Django (python), Rails (ruby) or Laravel (php)? 

Once I had analyzed all the options I was still hesitating between going with my head or going with my heart?  

What if it was neither but my instincts that would make the decision? 

I had the idea to do a mini project in each of the three firmware.  This mini project would have the particularity that I have to complete it as quickly as possible.  So no time to think, just let my instincts do the work.  

That's exactly what I did and the result is very surprising...

 I was hesitating between Laravel (my head) and Rails (my heart).  And guess what?  It’s Django who won the instinct test.  Under pressure and without having time to think it over, it was with Django that I had the best performance.  The code came out easier, more naturally, and faster.  It’s like there’s a natural fit between me and Django / Python.

Surprising but very interesting.  It completely calls into question my decision ... 

While waiting to decide my fate, I ask you the question.  If you would have to make a project under pressure, quickly and almost no time to think, which programming language / framework do you think you would be the most productive?
Why to learn ReactJS!
Tags: react, javascript, es6, node
Published: 2020-09-26 03:19:28

React is the front-end library of Javascript which follows Object-orientation with class-based and purely object based architecture to provide the single page application solution for the web development.

React is just a library and not a framework like Angular where all other things like Routing, HTTP modules, Forms modules are included. React gives you the flexibility to integrate any third-party library to add these functionalities to your application. 

Also, React has the declarative approach means you just have to declare the functionalities with the data model, and React will update the view and re-render it internally. 

In the declarative approach, let's say you ask an artist to draw a painting of some natural scenery and he will get you an awesome painting. But if you're asking the same thing to a 5-year-old boy then you have to mention the exact things like mountains, trees, birds, and blue sky. This is nothing but an imperative paradigm. 

Some of the amazing features of React are as follows:

1. It uses Virtual DOM for faster and optimized view renders.
2. Uni-directional data flow from parent to child components.
3. XSS - Cross-site scripting protection.
4. Component-based architecture
5. Typescript and Javascript platform support 
6. Flexibility to add any external library without any restrictions. 
7. Server-side rendering 

So these are some of the features provided by React. 
Also, you can watch the tutorial made for busy developers who wanted to learn react in short time. 

Check here- https://youtu.be/0TuQPKsfF0E

Also would love to say 'Hello' to you- https://twitter.com/_Don_2
 
Hope you liked this blog, Thank you! Happy Reading :)
Hacktober Fest
Tags: hacktoberfest, opensource
Published: 2020-09-26 02:55:30

I just registered for Hacktoberfest. Hacktoberfest is an Open source software event. It run the month of October. The event by Digital Ocean an DEV promotes the open source community. 
Anyone can sign up, contribute to project and earn a Tee-shirt or have a tree planted.
I signed up last year and started looking for issues. I found a repo looking for come to print "Hello World" in various languages. I knew some they needed I submitted a pull request and it was approved. But it wasn't October yet so it didn't count towards Hacktoberfest Goals. But I got some open source commits in and that was fun.
When October hits things here got busy. I was prepping then traveling for an art faire. and I never got to code for outside projects. No shows this year so I have some time. I joined with some other coders to help keep me accountable to work on stuff. 

Have you ever participated in Hacktoberfest?

What was it like?
 
[sign up here](https://hacktoberfest.digitalocean.com/)
Why I recommend DevExtreme of DevExpress 
Tags: frontend, styles, html, css
Published: 2020-09-26 02:44:08

What do you do if you have a big team ready to start a project and all of them have different ideas about how to do it? The normal way to proceed is to define the tools for all developers, this way they can have a common ground, but that place can be particularly hard to find in frontend projects in particular for the styles part, that's because there are countless ways in which you could present a button or a form.

There is where we can find helpful devExtreme, because is a library of high-performance UI widgets for use in traditional web and next-gen mobile applications, that allows customizing your frontend elements but at the same time they look cohesive though the user experience, and the best of all is that every element is responsive so it's one less problem.

DevExtreme has one amazing [demo-page](https://js.devexpress.com/Demos/WidgetsGallery/) where you can see examples of how to implement any of the widgets in every framework that they support (jQuery, Angular, Vue, React, AngularJS, ASP.NET Core and ASP.NET MVC) and I have to say it, the implementation is one of the easiest that I've encountered.

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

Finally, I wanted to present an example of how we been implementing devExtreme in the company I work for and isn't necessary to say that my favourites features are the charting and Mapping, the visual components are absolutely clean and pleasing to work with, so if in your project can allow investing some money for tools I really recommend this component suite for responsive web development.

Thank you for reading!
Link Checker Release v0.1
Tags: opensource
Published: 2020-09-26 02:40:29

Every once in a while I wake up in a cold sweat. My brain is moving faster than I can recognize it. One thought comes to the forefront:

**I can't figure out if all the links in the big long list of links on my desktop actually work without testing them one by one**

That's when I realized, the assignment I was given the second week of OSD600 was created to rectify this very problem.

Enter: Link Checker.

I'll explain the process in a moment but first let me describe what Link Checker is and what it does. Link checker is a node script that allow the user to specify a file, extracts the links from that file, and tests them to find if they are good or bad links.

![All Good! Kinda?](https://dev-to-uploads.s3.amazonaws.com/i/0l8if0688sho35hzmh0j.png)

Simple, right? Pretty much.

To use, all you have to go is clone the git repo, go into your node cli, and call the script by specifying the file you'd like to check.

`node index.js ../files/test.txt`

More information is available on my git repo for the app.

{% github fluentinstroll/Link-Checker %}

You might have an html file, a pile of links within, and you want to know if the links actually work. Link Checker does it easily.  It even colour-codes the links and tells you if they're good or bad.

Another feature is simple, but if you enter "-v" or "--version" it will give you the version number!

![0.1 Baby!](https://dev-to-uploads.s3.amazonaws.com/i/aekzc5emyhecqva8jbgk.png)

Writing Link Checker was not terribly difficult BUT it did involve some research and connections with fellow students. In my github readme you'll notice I used and sourced a few libraries, most of which were directly suggested by other students in OSD600. I also had the pleasure of working with another student on his own url verification app.

{% github joey2031/OSD600-Release0.1 %}

Joey was great help! And together we improved our apps.

Honestly working on this with the OSD600 group and Joey has been an absolute joy and if this is what a taste of open source development can be like, I'm hungry for more.
Three.js: Rolling a Sphere on a planet with structures
Tags: threejs, rotate, sphere, matrix
Published: 2020-09-26 02:37:08

Hi!  Just wanted to share some work in progress for a three.js game I am working on inspired by a mobile game called Pinout.

{% youtube Mp2oePgJbZw %}

If there's enough interest I will start sharing more detailed progress on what I'm doing.