teleren/devto huggingface dataset:
Questions about Full Stack JS
Tags: help, javascript, node
Published: 2019-10-30 17:47:20

I'm fairly new to the world of Node.js and I have some questions because I am greatly confused.

I did a project via Online Courses in Udemy
https://yelpcamp-web-coders.herokuapp.com

What got me confused, is that I read blog posts, did several google searches, and I found billions of courses, books, blog posts, technologies and this is where I am really greatly confused and I need to sort them on my head.

The only solution for me right is to create something on my own without any other courses, I got tired.

Doing courses and homework is easy, for example: write a sort function, make some classes or objects, sort by age, create some event listeners and so on. But what happens when you want to make a Full Stack Web App? And that's exactly where I'm stuck.

In the above project which was created in May, that project used Javascript 5 but that's ok. I learned a little bit of Node.js, npm, view engines and somehow managed to do it.

For starting I would like to create my own blog as full stack app

I know I can create a blog with Static HTML/CSS/Javascript and some JSON files but I want to do something more complex like for example when I or the user visits the following URL:

-  /blog/posts // Select only the Title and a Short Description from the Table Posts 
- /blog/posts/post_id // Select all from the selected title

My goal is to use 2 tables, the 1st will contain only id, post_title, and the 2nd will contain the post, date_created, primary_id, foreign_key (id from the 1st table) and will make them appear on my browser will relationships and I will also add comments from users via a different table. I'm sure with this I will be able to learn the basics for real.

Now, these are my problems:
1) Is node.js good for MySQL or PostgreSQL?

2) Which Template Engine should I use? I searched and I found many people mention Handlebars, pug, ejs. 

As I mentioned I want to be able to pull data from a database and make it appear to the user. What is the best to be used with FrontEnd, I want for example something like:

<html><head><title>title</title><body>posts</body></html>


Where title and posts will get them from the Database, also I would like to learn Angular and ReactJS in the future, 
How can I render my webpages with ReactJS or Angular, do I have to use a template engine like ejs and combine ejs with React or is there any different way?

3) Should I learn webpack? I read webpack's description if I understand correctly if for example, I have billions of CSS and JS files, webpack combine all of them and serve only 1 CSS and 1 JS file to the end user, is that correct?

4) Should I learn Docker?
I have 3 PCs, A desktop with Windows, A laptop with Ubuntu and a VPS with Ubuntu Server, if I have understood correctly, with Docker you create a container, throw your app, nginx, MySQL server and with a command, you are done.

I know how to create services, install apps on Linux and I think it might be a lifesaver if I want to change VPS and for testing purposes to all of my machines (I think so)

Thanks a lot.
Choosing an Autocomplete for Python
Tags: python, beginners, devtips, datascience
Published: 2019-10-30 17:16:38

---
title: Choosing an Autocomplete for Python
published: true
description: Code faster with a Python autocomplete for your IDE. 
tags: python, beginners, devtips, datascience
---

Using a code completion engine helps you remember syntax and write code faster. There are two main options around today for autocomplete in Python: Jedi and Kite. They both integrate with all the most popular IDEs for Python This video outlines why you should be using an autocomplete plugin while you code and how to choose the right completion engine for you.

{% youtube Qa-5mYCqPto %}

Want to try Kite? You can download it for free [here](https://kite.com/download/?utm_medium=referral&utm_source=youtube&utm_campaign=kite&utm_content=choosing-an-autocomplete-for-python).
How to setup django in windows machine
Tags: django, webdev, css, html
Published: 2019-10-30 17:11:26



So lets begin towards django setup

Steps

Step 1 First make your own Directory in windows Command prompt or in Powershell using command mkdir mydjango for example -mydjango i used here

Then simply change that directory using command cd Mydjango

Step 2 Then lets make your own virtual environment in that directory for that particular project using command python -m venv myenv

venv is virtual environment -m is for make i guess

After that you to activate your virtual environment using command

command :- myenv\Scripts\activate

Then you to install django in that particular directory using command

Command :- pip install django

Note:- in your system before doing this python is installed this is must for working of django commands and pip also

and after that for creating django project command is

Command :- django-admin.exe startproject mysite .

. for the directory structure if donot used then you can experience that i experience that :))

And after that you can run your project using

Command python manage.py runserver

127.0.0.1:8000 on your local system ok

and for creating app in django python manage.py startapp myapp

and for migrations of databases make sure add your app in settings.py file in installed app section ok

And for creating superuser for admin interface use command

Command :- python manage.py createsuperuser

and then migrate that particular file using

Command using python manage.py migrate

and check your browser for django project working

See using this command localhost:8000 port

View in image of my cmd
my django powershell command prompt view

Thnak you i hope you it for stay tuned suggestions are welcome

Connect me here for regular thoughts twitter

Check it out my own website here krishnakakade

Recommended IDE (integrated development environment for django) Pycharm for Sure :))
Chat with your team while you collaborate over code in VS Code
Tags: showdev, vscode
Published: 2019-10-30 17:07:19

I have been building [Live Share Chat](https://github.com/vsls-contrib/chat) over the last year or so, and I recently added support for **direct messages**: you can now DM your [VS Live Share](https://aka.ms/vsls) contacts, within or outside a collaboration session.

Fun fact: Live Share Chat started as an experiment to reduce my constant context-switching between VS Code and Slack. I wanted to see what it would be like to be able to chat about code with my Slack teammates.

At first, it seemed _weird_ to add chat to my text editor, but over time, I noticed how developers using VS Live Share started using the extension. It made sense to rename the extension to Live Share Chat, and emphasize the integration (I wrote about this journey [here](https://github.com/vsls-contrib/chat/issues/418)). The usage on Live Share has grown consistently over time, and that has motivated to keep working on it.

What do you think about this experience? Have you had a chance to try it out?
Show DEV: Introducing klap 👏 - a zero config, zero dependency bundler for tiny javascript packages
Tags: showdev, npm, typescript, react
Published: 2019-10-30 16:57:18

Aloha Dev.to community :wave:

I recently authored a zero config ([0cJS](https://twitter.com/hashtag/0cJS)), zero dependency tool to publish tiny NPM packages. The motivation behind `klap` is to provide best practices setup for **Modern Javascript Packages**, while focusing on zero configuration and zero dependency.

## :sparkles: Features

:tada: **zero config**: bundle your library using only a `package.json`
:boom: **zero config**: typescript support (just rename `*.js` to `*.ts`)
:star2: **zero config**: code transforms using babel macros
:rocket: **zero dependency**: uses [gcc-style bundling](https://www.npmjs.com/package/@zeit/ncc).
:haircut: **tiny bundles** for all inputs
:fire: **Modern JS** syntax with class properties, async/await, and generators
:confetti_ball: Supports **`react`** and **`styled-components`** out of the box.
:octopus: creates multiple output formats `cjs`, `esm` and `umd`
:zap: Built in Minification and Gzip Size Tracking
:cyclone: Built in development server for quick prototyping.


## :link: Github Repo

[https://github.com/osdevisnot/klap](https://github.com/osdevisnot/klap)

> `klap` is powered by [babel](https://babeljs.io) and [rollup](https://rollupjs.org), but uses gcc-style bundling to achieve zero-dependency.

Feel free to 🌟 the github repo if you like the approach

## :mouse: Examples

[https://github.com/osdevisnot/klap/tree/master/examples](https://github.com/osdevisnot/klap/tree/master/examples)

The examples folder showcases usage of the bundler for few scenarios.

**Give it a try next time you want to publish a package to NPM**
Which linux distro is best for general application development, docker and devops?
Tags: discuss, docker, devops
Published: 2019-10-30 16:38:02

Hello dev community,

I have finally decided to move away from windows 10, I liked it but it is very limiting in terms of docker and devops, as I have read online and experienced many lags with windows.

So, I wanted to know in your opinion which linux distro will be best for general development (I do native android development), devops, docker etc.

I want to basically know which distro you would prefer.

I have found that centos and ubuntu are most popular.

please share your views on this

Thanks
How to solve any programming problem?
Tags: javascript, productivity, career, todayilearned
Published: 2019-10-30 16:20:28

Solving a problem in programming is not always easy. I was very confident after learning some great frameworks like node, express, react, react-native and much more and created some awesome apps with JavaScript, but one day someone asked me a simple question. And the question was, how can you check a number is palindrome or not(condition you can't convert it into string)?

I tried and failed, again tried and failed. I became exhausted and started learning some basic concepts of programming.

In this article I am going to share `5 steps to solve any problem`. So lets start.

## 1. Understand the Problem: 
Before start writing the code you need to understand the problem. Understanding the exact problem can solve your problem more than 30%. You can ask some questions before start writing the code:
- Can I restate the problem in my own words?
- What will be the inputs in the problem?
- What would be the outputs should come from the solution?
- Would input determine the output?
- How should I label the important pieces of data that are part of the problem?

## 2. Explore problem: 
After understanding the problem you need to explore the possibilities like:
 - What if there is no input or invalid input?
 - Is any limitations to the output?
 Try to find the more options to better understand the problem.


## 3. Break it down: 
This is a most important method to solve any problem. You can break down the code into small steps to solve it. Write down the comments in steps, this will help you to be in track of solving the problem without distracting. Suppose, there is time limitation for solving any specific problem, and you are unable to solve it completely, your comments can help to get the good marks in that. Examiner would be able to understand your approach and right approach is the way to solve any problem. 

## 4. Solve and simplify: 
After writing the steps, start solving the problem. Try to solve simple steps first and then solve the complex one. 

## 5. Look back and refactor: 
 After solving the complete problem, look back to your code and try to refactor it. Make it concise and readable. Try to test it at least one time before submitting.

I hope this will help you to get out of any problem easily. :)
What advice would you give someone thinking about a career in software?
Tags: discuss
Published: 2019-10-30 16:06:02

I’m a student and consider coding as more of a hobby for me. I do enjoy it, but I’m at that stage where I have to think about what to major in for college. Is computer science something that I would want to do? It’s not an easy decision for me since my other interests that I like more *might* not be ones I could make a living doing.

How have you found your own careers in software have been?
Are you happy you chose it, or are you always thinking that maybe there was something else?

Any input would be appreciated.
Tips for Preventing Email Payment Fraud
Tags: email
Published: 2019-10-30 16:03:48

Payment fraud is rising as criminals devise increasingly cunning ways to deceive consumers. In the past year, fraud complaints surged as much as 40 percent.

One of the fastest growing types of fraud is Authorised Push Payment (APP) scams. These use emails to trick victims into making payments voluntarily. Members of UK Finance reported a huge 84,624 incidents of APP fraud last year, totalling £354.3 million in gross losses. The impact on victims can be devastating. Here’s how to prevent it from happening.

 
Type of Email Fraud

APP criminals monitor email threads and target victims specifically when they’re already expecting to receive a payment request from a legitimate organisation. The fraudsters send a message impersonating the legitimate company and requesting the victim make a payment. Emails can include invoices, but with bank details tweaked to that of the criminals account.

Another common approach is phishing emails. These lure victims into parting with their personal details which are then used by criminals to steal money. Similar to APP, the fraudsters often impersonate a legitimate source, such as your bank, HM Revenue and Customs and large organisations such as Amazon or PayPal.

 

What to Look Out For

Fraudulent emails can be tricky to spot. Here are some general rules to follow:

Approach any emails regarding payments with caution.
Before making a payment, verify the details with a company over the phone or in person, particularly if they’ve sent you an email with a change in their details.
Carefully check email addresses. Tell-tale signs of a fraudulent email include random letters, numbers or deliberate spelling mistakes.
Never click links or open attachments without checking the sender’s email address.
Exercise additional caution during times when you’re expecting a payment request, such as when you’re buying a house or paying an invoice.
 

How the Industry is Helping

Victims can’t always be reimbursed. In fact, where payments are authorised, such as with an APP scam, current legislation gives no legal protection to cover the losses. Thankfully, the financial industry is stepping in with tighter measures to prevent fraud and protect victims.

APP Scams Voluntary Code

This came into effect on May 28th to encourage payment service providers, including banks, to implement greater protection and reimbursement measures for fraud victims.

Complaints

If you fall victim to a scam you can now complain to both your bank as well as the bank receiving the fraudulent funds.

Confirmation of Payee

A system due to take effect next year, whereby anyone making a payment will be alerted if the account holder’s name doesn’t match the account.

Orignally published at https://www.smartdebit.co.uk/tips-for-preventing-email-fraud/
Database just from GraphQL! Dgraph Backend template
Tags: webdev, devops, node, graphql
Published: 2019-10-30 15:58:38

---
title: Database just from GraphQL! Dgraph Backend template
published: true
description: GraphQL Editor template for backend using very fast dgraph golang database server under the hood
tags: webdev, devops, node, graphql
---

# GraphQL Editor Team - Dgraph Backend template

This template is worth 2020 ✨.

Brought by [GraphQL Editor Team](https://graphqleditor.com)

## Why?

You get database with GraphQL interface for storing your data just from GraphQL Schema. 

## How it works

Like that, and it is only from GraphQL Schema!! :

![](https://raw.githubusercontent.com/graphql-editor/graphql-backend-template-dgraph/master/graphqldgraph.gif)

## Dependencies

[Docker](https://docs.docker.com/install/)

[jq](https://stedolan.github.io/jq/) 

These 2 are needed to run this

`npm`

## Quick Start

Clone this repo

```
git clone https://github.com/graphql-editor/graphql-backend-template-dgraph
```

```sh
npm install
```

To start with this template you will need GraphQL Schema. Create one with [GraphQL Editor](https://app.graphqleditor.com) and copy its contents to `schema.graphql` file. 
Example schema can look like this [Schema](https://app.graphqleditor.com/dgraph-testing/finance)
Remember when using Dgraph you need only Types, Interfaces and Enums. Also there is a small bug in Dgraph which doesnt allow comments in schema files.

Or if you are lazy:

Forget about the schema and use one inside repo. Do nothing and proceed.

Run this command in one terminal

```
npm run dgraph
```

And run this command in the other one

```
npm run inject-dgraph-schema
```

Voila. Your GraphQL native database is ready to use. Run queries in a tool like [Firecamp](https://firecamp.app), so Insomnia, GraphiQL etc.

## Generate Client libraries

When the server is running you can generate the actual dgraph generated schema file and autcomplete library for Javascript or TypeScript Frontend

### Browser / React Native

#### TypeScript
```
npm run generate-nodets
```

#### Javascript
```
npm run generate-nodejs
```


### Node

#### TypeScript
```
npm run generate-ts
```

#### Javascript
```
npm run generate-js
```

## Author

[Twitter](https://twitter.com/ACzemiel) - follow me for latest news with this boilerplate

[Github](https://github/aexol) - follow me for the latest news with this boilerplate


## Under the hood

[Dgraph](https://dgraph.io/)

[Zeus](https://github.com/graphql-editor/graphql-zeus)

## Additional resources

[Dgraph Definitions](https://app.graphqleditor.com/dgraph-testing/directives)
[Dgraph tutorial](https://blog.dgraph.io/post/building-native-graphql-database-dgraph/)
Re-create Airbnb’s Home Page with Tailwind CSS
Tags: css, tailwindcss, tailwind, webdesign
Published: 2019-10-31 19:54:20

---
title: Re-create Airbnb’s Home Page with Tailwind CSS
published: true
date: 2019-10-30 15:58:37 UTC
tags: css, tailwindcss, tailwind, web design
canonical_url: https://web-crunch.com/re-create-airbnbs-home-page-with-tailwind-css/
---

Continuing my Let’s Build: With Tailwind CSS series is another addition where I show you how to re-create Airbnb’s home page using only Tailwind CSS.

[Download the source code](https://github.com/justalever/tailwind-airbnb)

{% youtube 7phZqghhho0 %}

In this guide, I’ll show you how I re-created Airbnb’s home page with Tailwind CSS. At the time of recording, Airbnb had a different home page design than what you see today. While that was a big bummer I decided to still release this walk-through. It is a long video but as you might know, I like to be thorough in my approach. I hope you enjoy!

If you decide to follow along be sure to reference the source code linked above to get the assets and reference my final version.

Also, be sure to check out some of my other builds if you like this one:

### The Series So Far

- [How to Install Tailwind CSS v1.0](https://dev.to/justalever/how-to-install-tailwind-css-v1-0-p42)
- [Let’s Build: With Tailwind CSS – Tweet](https://dev.to/justalever/let-s-build-with-tailwind-css-tweet-3ejh)
- [Let’s Build: With Tailwind CSS – Dribbble Shot](https://web-crunch.com/lets-build-tailwind-css-dribbble-shot)
- [Lets Build: With Tailwind CSS – Responsive Navbar](https://web-crunch.com/lets-build-tailwind-css-responsive-navbar)
- [Lets Build: With Tailwind CSS – Movie Production Landing Page](https://dev.to/justalever/let-s-build-with-tailwind-css-movie-production-landing-page-6o1)
- [How to extend Tailwind CSS](https://web-crunch.com/how-to-extend-tailwind-css)

The post [Re-create Airbnb’s Home Page with Tailwind CSS](https://web-crunch.com/re-create-airbnbs-home-page-with-tailwind-css/) appeared first on [Web-Crunch](https://web-crunch.com).
Hacktoberfest: Race to the Finish
Tags: hacktoberfest, beginners, github, opensource
Published: 2019-10-30 15:37:33

---
title: Hacktoberfest: Race to the Finish
published: true
description: Hacktoberfest beginner issues
tags: hacktoberfest, beginner, github, open-source
cover_image: https://thepracticaldev.s3.amazonaws.com/i/0enl6r3lwxubga74abio.jpg

---

#Getting to the Finish Line

When October rolls around, it is impossible to miss all the posts and excitement for Hacktoberfest.  It was a goal of mine to participate this year, but because I was in the middle of some other projects, I was not able to contribute until the last couple of days.  I actually submitted my first PR yesterday!  Being a self-taught developer, wading into Open Source can be intimidating.  I wanted to highlight the resources and repositories that helped me in the process of contributing.

## Helpful Articles

The first article I read was from Victoria Fluharty.  Her article ["Hacktoberfest: Getting Over the Fear of Open Source"](https://dev.to/torianne02/hacktoberfest-getting-over-the-fear-of-open-source-41kg) was an encouraging read about getting over the fear of contributing and her excitement upon completing Hacktoberfest.

I also found this great article by Sarah Drasner called ["How to Contribute to an Open Source Project"](https://css-tricks.com/how-to-contribute-to-an-open-source-project/). The article does a great job of laying out the steps required to contribute to a project.

(In case you aren't already [Sarah Drasner](https://twitter.com/sarah_edo) is totally worth following on Twitter)

## Projects for Beginners to Contribute to

The following are projects that are great for first timers to contribute to.  I selected issues that accept multiple PR's, so you don't have to be "first" to the issue.

Quotebox - <https://github.com/bauripalash/quotebox/issues/1>

Add More Movie Quotes - <https://github.com/NikhilNamal17/popular-movie-quotes/issues/3>

Inspirational Quotes - <https://github.com/vinitshahdeo/inspirational-quotes/issues/4>

Add a Drink Recipe - <https://github.com/alfg/opendrinks/issues/633>
(there are multiple issues in this repo that you could tackle)

##You Can Do it!

If you started Hacktoberfest and haven't completed it yet, you still have time to contribute!

If you haven't signed up yet, you can head to <https://hacktoberfest.digitalocean.com/> to get signed up.

I hope these resources are helpful in getting you across the finish line :smile: