teleren/devto huggingface dataset:
Day 18 – Why Express JS ? - Learning Node JS In 30 Days [Mini series]
Tags: node, javascript, codenewbie
Published: 2019-12-21 20:01:21

In last tutorial we learnt about `installing express js` using `npm`. But why `express js` and what are options we have ?

Frameworks helps us to write code easily and maintain a standard of our codes. This really needed when multiple team member are working on the same code.

Can you think how many node js framework are available right now ?

Actually many! I didn’t find a number to tell you. But I can listed some –
- Express.js
- Nest.js
- Sails.js
- Koa.js
and many more…

See survey of 2018 — https://2018.stateofjs.com/back-end-frameworks/overview/
Express js is dominating when it’s time for a backend framework.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/yz41vujd79nnqfapjl7s.png)

Learning and using popular framework has a good benefits honestly. Because there is a huge community who can help you, also you can some decent jobs on the popular framework. But is this all the reason why I choose express ?

No there are more...

Express is
- Fast & Simple
- Speedy
- Scale-able
- easy to learn

###So are you interested to learn more about express ?

You can see the graphical version here
{% instagram B6WBpS5gn3k %}

Originally it published on [nerdjfpbblog](https://blog.nerdjfpb.com/day17-nodejsin30days/). You can connect with me in [twitter](https://twitter.com/nerdjfpb) or [linkedin](https://www.linkedin.com/in/nerdjfpb/) !


###__You can read the old posts from this series (below)__

{% post nerdjfpb/day-1-learning-node-js-in-30-days-mini-series-55e7 %}

{% post nerdjfpb/day-2-learning-node-js-in-30-days-mini-series-5023 %}

{% post nerdjfpb/day-3-learning-node-js-in-30-days-mini-series-24i4 %}

{% post nerdjfpb/day-4-learning-node-js-in-30-days-mini-series-1koc %}

{% post nerdjfpb/day-5-learning-node-js-in-30-days-mini-series-21jm %}

{% post nerdjfpb/day-6-learning-node-js-in-30-days-mini-series-758 %}

{% post nerdjfpb/day-7-learning-node-js-in-30-days-mini-series-3023 %}

{% post nerdjfpb/day-8-var-vs-let-vs-const-learning-node-js-in-30-days-mini-series-1i72 %}

{% post nerdjfpb/day-9-mastering-eventemitter-learning-node-js-in-30-days-mini-series-2dfe %}

{% post nerdjfpb/day-10-mastering-eventemitter-learning-node-js-in-30-days-mini-series-2802 %}

{% post nerdjfpb/day-11-creating-and-deleting-folders-learning-node-js-in-30-days-mini-series-3a2d %}

{% post nerdjfpb/day-12-creating-own-server-learning-node-js-in-30-days-mini-series-3ef %}

{% post nerdjfpb/day-13-buffer-stream-learning-node-js-in-30-days-mini-series-5c5d %}

{% post nerdjfpb/day-14-serving-html-pages-learning-node-js-in-30-days-mini-series-2hl3 %}

{% post nerdjfpb/day-15-sending-json-to-client-learning-node-js-in-30-days-mini-series-21pc %}

{% post nerdjfpb/day-16-routing-basic-learning-node-js-in-30-days-mini-series-5hk6 %}

{% post nerdjfpb/day-17-npm-node-package-manager-learning-node-js-in-30-days-mini-series-1nek %}
Python Tip: Auto-reload the console on file changes
Tags: python, django
Published: 2019-12-21 20:00:33

I find myself using the python console often in python (and Django) to test various things. But one annoying thing was that I had to restart the console (and all imports/commands until the line) every time I made the change.

There is a better way though.

### IPython autoreload

If you use IPython as your console, you can use the `autoreload` extension to automatically reload code up the current state. This makes the following flow possible:


```
In [1]: %load_ext autoreload

In [2]: %autoreload 2

In [3]: from foo import some_function

In [4]: some_function()
Out[4]: 42

In [5]: # open foo.py in an editor and change some_function to return 43

In [6]: some_function()
Out[6]: 43
```
See <https://ipython.readthedocs.io/en/stable/config/extensions/autoreload.html> for more information.

### Usage in PyCharm

PyCharm [does not yet fully support the IPython config](https://youtrack.jetbrains.com/issue/PY-14631?_ga=2.165123775.1472087216.1576953980-274049246.1575574552), but you can still set it up without too much work.

First, make sure you have IPython installed:

`pip install ipython`

* *Then, in `Settings->Build,Execution,Deployment->Console` make sure you have 'Use IPython if available' checked.

Last step is to add the following two lines to the Starting script.


```
%load_ext autoreload
%autoreload 2
```
![](https://res.cloudinary.com/ximg/image/upload/w_732,h_500,c_limit/f_auto/whoami/4a595384/post/o91ZaVIfyvhVENNR.png)
<figcaption>Console settings in PyCharm</figcaption>
That's it, now your console will automatically reload whenever you make file changes.


> Also check out my other article for how to [automatically load your models in the Django console.](https://loftie.com/post/django-console-tip/)
The Hactoberfest Snap Gift
Tags: hacktoberfest
Published: 2019-12-21 19:40:18

![hactober logo](https://hacktoberfest.digitalocean.com/assets/logo-hf19-full-10f3c000cea930c76acc1dedc516ea7118b95353220869a3051848e45ff1d656.svg)
**Hey, all HactoberFest fans! Here is a small gift for you all.**
 Received my swags a few weeks back and was thinking of creating something amazing for Hacktoberfest.
Here is an AR experience for you all using Snapchat. Use the swag received by you all to unlock the experience.
 Please do drop a like, share your reviews and do share this post as much as possible. 
{% youtube 43QlKzCRm8Y %}
**Details:-**
 Used a piece of funky Punjabi music in the background to add fun to the effect. Your name will be displayed on the marker. Created this 3d model to match the colours of Hactober (He looks kinda cool though to be a geek).
#**HOW TO TRY**
1. Install [Snapchat](https://play.google.com/store/apps/details?id=com.snapchat.android) if not already.
2. [Open this link](www.bit.ly/hactober_snap)
3. Click on unlock and bring the swag in front of the camera.
4. You may want to follow the dance steps, don't hesitate😅.
4. Record it with the snap camera button, download the video and share.
5. Do not forget to send the video, would love it.
**For any query, drop a message at my** [Linkedin profile](https://www.linkedin.com/in/akash-bajpai-61028616b/)
or at
{% user akash4bajpai %}

#Keep Hacking, keep growing!
Devlog Dec 21 2019 - A Tiny Adventure
Tags: javascript, svelte, games, devlog
Published: 2019-12-27 16:42:54

---
title: Devlog Dec 21 2019 - A Tiny Adventure
published: true
date: 2019-12-21 19:33:31 UTC
tags: javascript, svelte, games, devlog
canonical_url: https://triptych.writeas.com/devlog-dec-21-2019-a-tiny-adventure?pk_campaign=rss-feed
---

# Devlog Dec 21 2019 – A Tiny Adventure

I'm working on a simple game that is teaching me how to use [Svelte](https://svelte.dev/). It's called [A Tiny Adventure](https://csb-sfov2.netlify.com/) and is a spiritual successor to a game I created long ago called [Foobar The BazBarian](https://glitch.com/~foobar-the-bazbarian). Whereas here I'm figuring out how to create it with Svelte components, and learning how Svelte handles events.

Basically Svelte allows you to pass events up from child to parent. And pass data back down via “props”. I'm learning how to use this to pass the direction data from my control component to my display component. Right now all this does is let the display component render the direction. But this is a minor milestone for me because now I can separate out the components and create a simple store where I can place descriptions, items, and monsters.If you want to play around with this, you can visit the code here:

[![Edit quirky-firefly-sfov2](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/quirky-firefly-sfov2?fontsize=14&hidenavigation=1&theme=dark)

Next up is to get the display component to react to this value change and do something interesting.

> Written with [StackEdit](https://stackedit.io/).
Simple site, but speed is too much low
Tags: sitespeed, issuewithspeed, siteperformance
Published: 2019-12-21 19:32:50

Hi friends,

As i mentioned in one comment, My website is very simple with images and contents, but the speed is very low. I used wp rocket for cache but no result. I use to many other plugins for this but no success. Can anyone tell me how i can overcome this problem? if you want to check my blog here is the link https://triviaquestions4u.com I check with my seniors but failed.
Learn to create reusable button component in react.js
Tags: codewithghazi, react, javascript, tutorial
Published: 2019-12-21 19:31:01

Reusable Button component which can be used application wide with less code and is tested with all scenarios to maintain UI consistent in whole application with value and prop-types validation.

When designing interfaces, break down the common design elements (buttons, form fields, layout components, etc.) into reusable components with well-defined interfaces. That way, the next time you need to build some UI, you can write much less code. This means faster development time, fewer bugs, and fewer bytes down the wire.

{% youtube 8HyXbw3T0P8 %}
Merry Christmas, Microsoft!
Tags: christmas, azure, devops
Published: 2019-12-21 18:54:12

🎄 This post represents my gratitude and wishes for the only "thing" that won't make me cry for this Christmas 2019:

<b>So, thank you Microsoft, Azure etc.</b>

You know, people this year made me suffer a lot for this. It's a difficult everyday life too, because of jealousy, 'cause they eat/hit me, 'cause I'm not an ordinary..

I feel your help and your force every day. 
But I confess, I'm really sad nowadays, because being in Redmond in this Christmas period would helped me a lot, staying with the people I love. 
And I wouldn't be alone right now with the one(s) who "use and leave" me like a disposable.

But I'm ok, because I feel you across the distances. 

Merry Christmas and Happy New Year, Geniuses.
Hugs,

Francesca
Intro to the Fetch API & Rendering Data with JavaScript
Tags: javascript, tutorial, beginners, webdev
Published: 2019-12-21 17:06:25

---
title: Intro to the Fetch API & Rendering Data with JavaScript
published: true
description: We take a look at how the Fetch API works by getting some dummy data. We then render the dummy data to the screen using Vanilla JavaScript and inserting HTML.
tags: javascript, tutorial, beginners, webdev
canonical_url: https://codebushi.com/fetch-api-with-javascript
---

In this video, we take a look at the browser's built in Fetch API to get some dummy data. We then map over that dummy data to create some HTML with Vanilla JavaScript and render it onto the screen.

{% youtube FN_ffvw_ksE %}

Key Takeaways From The Video:


3:20 - The Fetch API returns a Promise, so you need to wait for the promise to resolve by using .then() after it.

4:16 - After the promise is resolved, you will get a Response object, which will tell you the status code of the response among other details

5:15 - We need to run the .json() method on the response object to turn the response into more useful data. The .json() method will also return a promise, so we need to chain another .then() onto it.

8:10 - When using the Fetch API, it won't automatically throw all errors. You have to manually check to see if the response object has an "ok" property on it, and throw an error if it's not. This will help you catch things like a 404 error with the response.

11:11 - In order to render our data to the screen, we can use innerHTML or insertAdjacentHTML and insert an HTML string into an existing HTML element.

14:13 - Since the data we get back is an array, we can perform .map() on the array to loop over the data. We then use Template literals to construct our HTML string.

22:10 - With the Fetch API, you can also perform a POST request by adding additional options when making the request. Make sure to add the proper "headers" and use JSON.stringify() in the body of the request.

If you liked this video, please support it by [subscribing to the channel!](https://www.youtube.com/channel/UCS6lPt9btmTG3GkU82ELygA)

You can also visit [Code Bushi](https://codebushi.com) for more resources on Web Development!
Our favorite blog posts from 2019
Tags: career, architecture, productivity
Published: 2019-12-21 15:56:24

Every month, various teams at United Remote are reading a dozen or more blog posts and books. Some of us even were ambitious enough to challenge themselves to read 50 books in 2019 (and one of us even [made it happen](https://www.goodreads.com/user/show/4242913-s) 🤯). 

And like a lot of startup teams out there, we make it a sacred tradition to spam each other on Slack with links (and screenshots) of whatever we're reading in real-time 😅. 

While there is certainly no limits to which topics we read about and we certainly don't limit ourselves to blog posts. 

We wanted to share with you some of the developer-centric blog posts that we enjoyed reading in 2019, in the hope that they inspire you to learn more and build great things in 2020.

And of course, we would love to hear about your favorite blog posts of 2019 in the comments section.

- [Things I Learnt from a Senior Software Engineer](https://neilkakkar.com/things-I-learnt-from-a-senior-dev.html)
- [Don't Call Yourself A Programmer, And Other Career Advice](https://www.kalzumeus.com/2011/10/28/dont-call-yourself-a-programmer/)
- [Undervalued Software Engineering Skills: Writing Well](https://blog.pragmaticengineer.com/on-writing-well/)
- [Software Architecture Guide](https://martinfowler.com/architecture/)
- [How to do a code review](https://google.github.io/eng-practices/review/reviewer/)
- [Software Engineering at Google](https://arxiv.org/pdf/1702.01715.pdf)
- [How To Be Successful](https://blog.samaltman.com/how-to-be-successful)
- [Tech Interview Handbook](https://yangshun.github.io/tech-interview-handbook/)
- [The Lesson to Unlearn](http://paulgraham.com/lesson.html)
- [Build your own React](https://pomb.us/build-your-own-react/)
- [Don't Do This in PostgreSQL](https://wiki.postgresql.org/wiki/Don%27t_Do_This)
- [Productivity Isn’t About Time Management.](https://www.nytimes.com/2019/03/28/smarter-living/productivity-isnt-about-time-management-its-about-attention-management.html)
- [My favourite Git commit](https://fatbusinessman.com/2019/my-favourite-git-commit)

Got a question or remark ? email me via zack[at]unitedremote.com
How do you introduce yourself to recruiters?
Tags: discuss, career
Published: 2019-12-21 15:55:11

---
title: How do you introduce yourself to recruiters?
published: true
description: A good job title has to be gratifying and authentic. What's yours?
tags: #discuss #career
---

The [2019 State of JS survey results](https://2019.stateofjs.com/) were published a few days ago, revealing many precious insights about the industry.

Among the questions asked was an odd one: *How do you introduce yourself at parties?* Of course, Twitter did its thing and had a good laugh picturing that social situation.

{% twitter 1208040661737496576 %}

But what I find most unfortunate is that the options were limited to the traditional front-end, back-end, web and full-stack developers. As I'll be on the job market soon, I've been thinking about the best way to sell myself on the job market, while staying authentic.

If you could write your own job description, what would it be? **How would you introduce yourself to a recruiter?**

I've gathered a few titles that I find interesting:

* UI developer/engineer
* Creative developer
* Product developer/engineer
* Devops
* Software developer/engineer
* Software architect

The one that resonates with me is *Product Developer*. I like to have an impact on what I'm building, not just how I build it.

What about you?
Estimating user's GPU performance capabilities
Tags: help, javascript, webperf
Published: 2019-12-21 15:12:48

I slowly started making my portfolio site and I want to use Three.js and shaders.  I feel like I should have some sort of a fallback for mobile and low-end PCs.. 

# How do you adjust your web content to match client machine's performance?

Currently for the sake of testing I put a pretty compute heavy shader that works fine on my home PC, but completely chunks down my mobile and office PCs: 
https://www.jerzakm.com/


### Option 1: [WEBGL_debug_renderer_info](https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_debug_renderer_info)

Webgl context allows us to accurately (In most cases) get user's GPU. Sounds great but from a first glance it has two disadvantages:

- User privacy. Knowing precise GPU model allows for ad targeting and unnecessary data mining.
- Keeping it up to date. New GPUs come out all the time, and it would become necessary to update GPU list and benchmarks.

There are libraries already available that do precisely that, but I'm not 100% happy with any of them.
[detect-gpu](https://www.npmjs.com/package/detect-gpu)

### Option 2: Rendering a few first frames off-screen and checking performance before deciding how to proceed

This takes care of privacy issues, but requires loading potentially unnecessary libraries and causing a browser freeze on first load.
Using Apache Kafka for horizontal scaling of a temporal document store? 
Tags: discuss, database, kotlin, java
Published: 2019-12-21 14:10:26

Hi all,

since about a year I'm reading a bunch of stuff about distributed systems, especially database systems, for instance Martin Kleppmans "Data Intensive Applications" and just bought the Database Internals book. He's a big proponent of storing data in a **distributed log** as for instance Kafka or BookKeeper and building more or less (materialized) views from the stored data in various systems on top.

I really like the idea. However, instead of storing data in the backend of Kafka (for that kind of use case I think BookKeeper is better as a transaction commit log and he suggested it) for my Open Source project [SirixDB](https://sirix.io) I'm envisioning of replacing the Kafka backend and storing directly in my log-structured storage system, as it does not need a transaction log (just an in-buffer, which can be flushed to disk if otherwise too much memory would have to be used). Thus, one of the cool things is, that resource-wide transactions (on documents -- binary JSON or XML files) in a database are implemented using an atomic swap of an UberPage, which is the main entry point into a trie based index structure (of indexes). Thus, it would be great to not have to store data in a second data store, so to say.

There's a great [article](http://www.vldb.org/pvldb/vol11/p2249-sauer.pdf) from Goetz Graefe, Caetano Sauer and Theo Härder about a similar approach.

I've read that recently reads can be made from followers, which are in sync with the leader of a partition in Kafka, so what do you think about this idea? I think the backend could be replaced.

The cool thing is that in Kafka a topic would probably be a database in my case and a partition a resource, which should be replicated to some nodes in a cluster.

Kind regards and a great christmas time
Johannes
Best JSON editor/viewer
Tags: javascript, python, react, mongodb
Published: 2019-12-21 13:11:04

[If you're free for some time to fill what you did in coding for one year(Developer Survey) & Earn cool Gifts Hurry up.](https://www.developereconomics.net/?member_id=iwCrdPEo)

[Survey Link](https://www.developereconomics.net/?member_id=iwCrdPEo)

-------------------------------------------------------------
As I know many of them using http://jsoneditoronline.org/ to view or edit the JSON files.

But as I observe ads are irritating some times, as they showing irrelevant ads.

I started using the JSON editor Extension from chrome Store
JSON editor Chrome Extension [Link]
(https://chrome.google.com/webstore/detail/json-editor/lhkmoheomjbkfloacpgllgjcamhihfaj)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/swosivqtog0nbyz3b77z.png)
For fast usage of JSON editor Extension bookmark this to chrome tabs
A Mac OS Keyboard shortcut, How to maximise a minimised window
Tags: tutorial, productivity, beginners
Published: 2019-12-21 13:05:48

---
title: A Mac OS Keyboard shortcut, How to maximise a minimised window
published: true
description: A developer style to maximise a minimised windows in Mac OS
tags: tutorial, productivity, beginner 
cover_image: https://thepracticaldev.s3.amazonaws.com/i/qdeyktm7rlipzy88eq8h.jpeg
---

If you love working with Mac OS only using the keyboard like me, so keep reading. 

According to the [Apple](https://support.apple.com/en-gb/guide/mac-help/mchlp2469/mac)

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/ch1e471yx23cyb3phcs2.png)

However, I prefer to use the trackpad as less as possible, hence I was looking for a way and to be honest it took a while for me to find a way to maximised a minimised window with the keyboard in Mac OS. 

So here is how I have managed to do it:

- Press CMD + TAB 
- Hold the CMD and press the TAB key until the focus is on the app that you have minimised by CMD + M or using the minimised button by mouse 
- While holding the CMD key press Down-Arrow key 

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/j2dvbe6ipr3a954px5an.png)

- When the above screen appeared, release the CMD key
- Press Down-Arrow key one more time to select the window that you desire to maximise 

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/9l7300keame6kezqssrr.png)

- Press enter 

and voilà, you have maximised a minimised windows without usage of the trackpad, It is a simple thing but it was annoying for me, so I thought it can be worth sharing. 

happy coding :)
Icodebetter platform how to add additional value to static Lookup filed
Tags: help, icodebetter
Published: 2019-12-21 12:19:47

Hello,
I'm using the Icodebetter.com platform to develop my app.
I'm trying to add combo box static lookup but it seems that there are new interface scenes 2018
NEW - https://snipboard.io/WuOL7v.jpg
OLD - https://www.youtube.com/watch?v=bJzHxnoXYPk&list=PLbTcZTMiXzUG6oza39GD5gSe6KkK7hZeq
screenshot: https://snipboard.io/vO46iX.jpg
FROM youtube tutorial at https://www.youtube.com/watch?v=bJzHxnoXYPk&list=PLbTcZTMiXzUG6oza39GD5gSe6KkK7hZeq (min 1:32)
so hope some can guide me how to add additional value to static Lookup filed