Best way to improve your coding productivity

Image for post
Image for post
Photo by Florian Olivo on Unsplash

Introduction

In this article, we will talk about Emmet. A very popular and highly useful tool that is built into almost every IDE out there like Visual Studio Code, Sublime Text etc.

What is so special about emmet?

It allows us to just type some abbreviations and generate the output HTML and CSS code.

Installation

Emmet is already available in almost every IDE so you don’t need to install it. …


Image for post
Image for post
Photo by Julien Pouplard on Unsplash

Over the past few years, there have been many updates to the JavaScript language. And these updates are very useful if you want to improve your coding skills.

Note: This is the final short preview of content from Mastering Modern JavaScript book. There is a lot more covered in the actual book.

Check out my previous post to get more preview content if you missed it.

Array.prototype.includes

ES7 has added this function that checks if an element is present in the array or not and returns a boolean value of either true or false. …


Become an expert in Modern JavaScript and better at React, Angular, Vue

Image for post
Image for post
Photo by Artem Sapegin on Unsplash

In today’s constantly changing world, a lot of new content and updates are coming to JavaScript which are very useful for improving your code quality.

Let and const

Before ES6 came, JavaScript was using var keyword so JavaScript was only having a function and global scope. There was no block-level scope. …


And also learn how to add drag and drop feature to upload any type of file

Image for post
Image for post
File Upload

Introduction

In this article, we will create a file upload and download functionality with a preview of the image using the MERN stack.

  • How to upload a file using drag and drop
  • How to upload and download any type of file
  • How to restrict the type of the file while uploading
  • How to restrict the size of the file while uploading
  • How to show a preview of the image after selecting it
  • How to use MongoDB to store and get the details of the file

and much more.

Instead of storing the file in the MongoDB database as base64 encoded, we will be storing the file on the server and only storing the path of the file inside the database so as to keep the database size smaller and to easily access and move the files as per the need.


Create an amazing JAMStack App from scratch

Image for post
Image for post
Bookmark Manager App

Introduction

In this article, you will create a Bookmark Manager App using FaunaDB GraphQL API and Netlify serverless functions.

  • If you’re new to GraphQL and Apollo Client, check out my previous article here to understand the basics of GraphQL. …


Learn the way to secure your application data using environment variables

Image for post
Image for post
Photo by Fotis Fotopoulos on Unsplash

Using Environment variables is very important to keep your private information secure.

Using Create React App

with single .env file:

If you’re using create-react-app, then to use environment variables in your application, you need to create a .env file in the root of your project with each variable name starting with…


Create a Spotify App with OAuth Authentication

Image for post
Image for post
Spotify Music Search App

Introduction

In this article, you will create a Fully Responsive Spotify Music Search App using Spotify Music API.


Easily create and publish an npm module to npm repository

Image for post
Image for post

Introduction

In this tutorial, you will create your own npm package and publish it to the npm repository.

  1. How to create an npm package
  2. How to install it locally before publishing to test its functionality
  3. How to install and use the published package using ES6 import syntax or using Node.js require statement
  4. How to manage semantic versioning of the package
  5. How to update the package with the new version and publish it again

To be precise, you will build a package that will return a list of GitHub repositories of the specified username sorted by the number of stars for each repository.


Generate JSON data quickly to use in any application

Image for post
Image for post
Photo by Safar Safarov on Unsplash

Introduction

In most of the applications, you need to have some static JSON data with which you can create and test the application without directly using the production data.


Some of the most useful and popular VS Code extensions you should use

Image for post
Image for post
Photo by Riku Lu on Unsplash

Visual Studio Code (VS Code) is the most popular IDE for Developers right now because of its simplicity and the availability of extensive extensions.

1. Relative Path

About

Yogesh Chavan

Full Stack Developer | JavaScript | React | Nodejs. https://dev.to/myogeshchavan97

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store