DEV Community: Nishant Mittal

What terminal config do you use?

Nishant Mittal — Tue, 16 Nov 2021 11:48:32 +0000

Hey all,

Writing this post to know what terminal config do you all I use?

Here's mine. (Oh-My-Zsh + Spaceship Theme)

What tools do you guys use for managing your tasks/goals

Nishant Mittal — Wed, 18 Aug 2021 19:25:09 +0000

As the title says, i am intersted in knowing what all tools do you guys use for managing everything like daily tasks, project specs, plans, professional goals, long-term (yearly) goals, kanban baords maybe, etc.

Currently, I use two tools

Notion - To manage a list of long-term goals, what I want to do focus on for the next couple of months etc.
Joplin - For managing daily tasks.

Reasons why Django is the best web framework

Nishant Mittal — Wed, 16 Jun 2021 19:35:45 +0000

Choosing a web framework is hard especially now when there are a lot of frameworks on the market, each designed to address different project needs. Here is why I think that Django is the best choice in most cases.

What is Django?

Django - The web framework for perfectionists with deadlines.

Django is an open source and powerful web framework written in Python that encourages rapid development and clean, pragmatic design. It takes care of much of the hassle of Web development, so you can focus on writing your app without needing to reinvent the wheel.

It is being used by a lot of companies including Instagram, Pinterest, Spotify, Disqus, Dropbox, Mozilla, Reddit which makes it obvious that the applications built with this framework are exceedingly scalable.

What can you do with Django?

If you are a beginner, you'll love the approach the platform takes for making web development easier. If you want to make robust web apps with a minimal amount of coding, you will appreciate what Django framework has to offer.

You can do anything web-based using Django. From building e-commerce systems, CRM Systems, Email Systems to developing a REST/GraphQL based API server for your frontend application there's nothing that you can't do using Django.

The most awesome thing about Django that I'll talk about later too in this article is it's large community. Most of the times the features you need are already present in Django. However, if there not there's a very high probability that you'll find a Django plugin or package developed by the community that does that task for you.

Features

There are a lot of things about Django that I like. I won't be able to write about all of them, So, here are some of the most awesome features among them.

Batteries Included

You don’t need to code basic stuff, it comes pre-packaged. These packages were developed by professional developers, so you won’t need to spend time making sure they work correctly. Some of the features included in this framework are as follows.

It has a very powerful ORM. Once you’ve created your data models, Django automatically gives you a database-abstraction API that lets you create, retrieve, update and delete objects.
It makes handling the database migrations easy.
It has in-built Session handling.
It also handles URL Routing for you along with dynamic URLs.

Admin panel

Django has an customizable admin interface, so you can manage data using basic CRUD operations. It’s a very useful feature so you can start your project right away, without having to code this functionality. The admin panel can also be configured to have customized filters, or the data can be grouped using a particular field.

Template System

Django has it's own in-built templating system also known as Django template language (DTL). However, if you want you can also use any other template engine like Jinja2. Moreover, you also have an option to write your own custom template system. How cool is that?

Your template can be divided into further re-useable components, which also alignes with one of Django’s core template design principles and it’s a design pattern that stands for Don’t-Repeat-Yourself (DRY). It’s exactly what it sounds like, it means that you shouldn’t, at least in most cases, by copying and pasting the code. Your template, can be divided into reusable components such as the side navigation bar, the main navigation bar, the header of the page, the footer of the page and so on. This minimizes repetition and makes for writing efficient and cleaner code.

Super Customizable

You can tackle just about any web app development project, whether it is a basic website or a high-end web app. It is also compatible with all major databases and even works with multiple database management systems at the same time like PostgreSQL, SQLite, Oracle, etc. It’s fully loaded with extras and scalable, so you can make applications that handle heavy traffic and large volumes of information.

Django offers a large amount of custom web development options. Since Django is built around Python, the design rules of the coding language dictate that web development time needs to be optimized. You can get your custom apps developed in a much smaller time frame than any other framework would allow you to.

Security

Django takes security seriously and helps developers avoid many common security mistakes. You do not have to implement security features manually to keep web development going. he framework has protection against XSS and CSRF attacks, SQL injections, clickjacking, etc. A Django web application is fully secured with industry-standard user authentication systems.

Scalable and Reliable

As said above, some of the largest web applications like Instagram, Reddit, Spotify use Django as a backend framework, we can agree that it's both scalable and reliable. If you’re just starting, Django provides the functionality that enables you to create a small project and scale it as needed. You can handle more user requests and greater volumes of data if your web app goes through a growth spurt.

Community

Django has been around for a while now, and its large community makes the platform even better. As it's an open source project, Django is supported by active volunteers who constantly work on stabilizing and improving the framework. It has about 58k Github stars.

Apart from the developers that directly contribute to Django, there are people in the community who develop great plugins to make app development easier for budding developers.

Documentation

As a result of super huge community, Django has a suberb documentation. It has detailed quick-start guides, detailed release notes, backward-compatible changes. There are dedicated websites for the platform where you can find help for any issues that you may run into. If you need help with your projects, the community support can always be banked on.

That's it for this article. I would love to know what do you think about Django and this article. Please feel free to comment below or reach out. Thanks for reading!

What is the best place to discuss dev project ideas?

Nishant Mittal — Sat, 23 Jan 2021 23:05:35 +0000

Wanted to ask the community about what is the best place to discuss side project / in general dev project ideas to see if users are really interested in the idea.

Add github based comments on your gridsome blog

Nishant Mittal — Thu, 07 Jan 2021 12:43:35 +0000

Overview

This is a guide on how you can add GitHub based comments on your Gridsome powered blog like shown in the picture below.

We will use a component named Gitalk in this article. All the comments are stored in a github issue. So, you don't need a seperate database for storing the comments.

Let's Start

Create a GitHub OAuth application

Go to your Github App Settings.
Go to OAuth Apps.
Create new OAuth application.
Fill in all the required details. In the Authorization callback URL fill in the URL where your site will be deployed.
Copy the Client ID and Client Secret from your OAuth App.

Configure your Gridsome app

First of all, install the gitalk gridsome plugin.

yarn add gridsome-plugin-gitalk

Now, in your gridsome.config.js add the following block to your plugins.

module.exports = {
  ...,
  plugins: [
    ...,
    {
      use: "gridsome-plugin-gitalk",
      options: {
        clientID: "kuy78h87gg87g8g89", // The client id you copied earlier.
        clientSecret: "r248hf924hfhh8fh8a2", // The client secret you copied earlier.
        repo: "nishantwrp-website", // The name of the github repo where the comments should be stored.
        owner: "nishantwrp", // The username of the owner of the github repository.
        admin: ["nishantwrp"], // The usernames of the admins of the repository.
      }
    }
}

Now, you're all set. You can just use the gitalk component in your Vue files like below.

<Gitalk />

That's all

If you did everything correctly, the comments and github authentication should work correctly when you deploy it. For further advanced configurations please refer to the plugin docs. Thanks!

Hi, I'm Nishant Mittal. Thanks for reading this post. Feel free to comment or reach out on Twitter in case of any queries. You can also find me on Github, Linkedin.

Finding an organization for google summer of code

Nishant Mittal — Sun, 27 Dec 2020 18:17:49 +0000

Google Summer of Code

For those who don't know about Google Summer of Code, it is one of the most popular program for college students. It is an international annual program in which Google awards stipends to students who successfully complete a free and open-source software coding project during the summer.

The problem

It is a common practice that the students start contributing to open source organizations that have high chances of appearing in GSoC a lot before the organizations are announced. It gives you an edge over other applicants because you would be much experienced with the project's codebase, in case you've started contributing early which in turn increases your chances of your proposal getting selected.

The people who've tried to find an organization by going to official GSoC archives would know the struggle of finding the open-source project that meets your interests. This is because in the official GSoC archive you can only see the organizations that appeared in a particular year at once and they can be filtered by only one parameter i.e. Category.

The solution

Here's a tool that could help make your work easier. It's known as GSoC Organizations.

This tool solves all the problems that were there in the official GSoC archive like

See the organizations which participated in different years on the same page.
Filtering the organizations by various factors like Years of participation, categories, technologies, and topics.
You can view the number of completed projects in the organizations in various years in form of a graph.

Here are some screenshots.

Here is the link to this tool - https://www.gsocorganizations.dev
At last, may the source be with you!

Strapi vs Netlify CMS

Nishant Mittal — Wed, 18 Nov 2020 17:41:40 +0000

I currently use Contentful for my blogging site (https://github.com/nishantwrp/nishantwrp-website). But now I wanted to migrate to an Open Source, self hosted CMS. I have two options

Netlify CMS
Strapi

I wanted to know which one of these would be best in my case and why?

Google APIs OAuth in Django

Nishant Mittal — Fri, 09 Oct 2020 00:06:57 +0000

Making an authentication system with google sign-in is a relatively simpler task to do. It can be easily done using Firebase authentication. But the problem comes when we need to access Google APIs of our users such as Google Calendar, Gmail, Drive etc. The main problem is getting the user tokens and storing them. So, that our application can access the Google APIs of the user once they've granted the access and not asking them to authenticate again and again.

So, here is how you can integrate Google OAuth with your Django application and retrieve, store the user tokens. Which can be used to create authenticated requests to Google APIs through google-api-python-client.

Objective

In this article, I am going to show you how you can integrate Google OAuth with your Django application and store the user tokens for future use, accessing the Upcoming Events in the user's Google Calendar using the stored credentials.

Prerequisites

I'm going to assume that you've already created a project in Google API Console, enabled the Google Calendar API for your project, setup an OAuth consent screen and you have a client_id.json file.

I'm also assuming that you have already initialized a django application.

Let's Start

First of all, you need to install google-apis-oauth-django to setup oauth and google-api-python-client to access Google APIs using the following command.

pip install google-apis-oauth-django google-api-python-client

First of all create a Sign In With Google button that redirects users to an url say google_oauth/redirect/. First you need to create a view for redirecting users. In your views.py add the following code.

import os
import google_apis_oauth

from django.shortcuts import HttpResponseRedirect

# The url where the google oauth should redirect
# after a successful login.
REDIRECT_URI = 'http://localhost:8000/google_oauth/callback/'

# Authorization scopes required
SCOPES = ['https://www.googleapis.com/auth/calendar']

# Path of the "client_id.json" file
JSON_FILEPATH = os.path.join(os.getcwd(), 'client_id.json')

def RedirectOauthView(request):
    oauth_url = google_apis_oauth.get_authorization_url(
        JSON_FILEPATH, SCOPES, REDIRECT_URI)
    return HttpResponseRedirect(oauth_url)

Now in your urls.py, You can include this view by doing something like

urlpatterns = [
    ...,
    path('google_oauth/redirect/', RedirectOauthView)
]

Now when a user clicks on that Sign In With Google button they would be redirected to a google oauth screen. After a successful login they would be redirected to the REDIRECT_URI that we have specified above i.e. google_oauth/callback/.

So, we need to write a view for that as well. In that view we can now successfully retreive the user credentials as they are successfully authenticated by doing something like this.

def CallbackView(request):
    try:
        # Get user credentials
        credentials = google_apis_oauth.get_crendentials_from_callback(
            request,
            JSON_FILEPATH,
            SCOPES,
            REDIRECT_URI
        )

        # Stringify credentials for storing them in the DB
        stringified_token = google_apis_oauth.stringify_credentials(
            credentials)

        # Store the credentials safely in the DB
        ...

        # Now that you have stored the user credentials you
        # can redirect user to your main application.
        ...
    except exceptions.InvalidLoginException:
        # This exception is raised when there is an inavlid
        # request to this callback uri.

Adding this view in the urls.py.

urlpatterns = [
    ...,
    path('google_oauth/callback/', CallbackView)
]

Now, as you have the user's credentials. You can access the Google APIs by the following method.

import google_apis_oauth
from googleapiclient.discovery import build

# Load the stored credentials in a variable say 'stringigied_token'

# Load the credentials object using the stringified token.
creds = google_apis_oauth.load_credentials(stringified_token)

# Using credentials to access Upcoming Events
service = build('calendar', 'v3', credentials=creds)
now = datetime.datetime.utcnow().isoformat() + 'Z'
print('Getting the upcoming 10 events')
events_result = service.events().list(
    calendarId='primary', timeMin=now,
    maxResults=10, singleEvents=True,
    orderBy='startTime').execute()
events = events_result.get('items', [])

if not events:
    print('No upcoming events found.')
for event in events:
    start = event['start'].get('dateTime', event['start'].get('date'))
    print(start, event['summary'])

That's it! Similarly you can use these credentials to access other Google APIs as well.

Google Summer of Code 2020 with Oppia

Nishant Mittal — Tue, 08 Sep 2020 14:56:26 +0000

Oppia is a platform that enables anyone to learn and teach anything they want in an effective and enjoyable way.

About the project

Oppia was initially written in AngularJs (1.X) but as Angular was released, it was decided to migrate the application to Angular. Also, as Angular uses TypeScript instead of JavaScript all the content of JavaScript files was copied as it is. But as the main feature of TypeScript is static typing. A part of my project was to ensure type safety in the ts files with writing relevant unit tests and adding CI checks to ensure that this convention is followed in the future.

The other part of my project was related to webpack. In particular, the goal was to make the webpack build faster and moving some libraries currently imported using script imports to webpack

Milestone 1

In particular, the work done in milestone 1 was

Write type definitions for the third party libraries that didn’t have those.
Coming up with a convention for declaring the types.
Declare types for about 50% of the TypeScript files.

This also involved writing lint checks to ensure that the third party libs have type definitions and when a contributor upgrades the version of a library, they would also have to update the types if relevant.

The convention that was decided for naming i.e. camelCase and snake_case was the following two things

HTTP requests should only be made only with the files suffixed with backend-api-service.ts
All the HTTP backend api services should return domain objects instead of a backend dict.

So, in this milestone I covered the first part and also writing a lint check for ensuring that this convention is not broken.

PRs involved

Milestone 2

The work done in milestone 2 was

Add types for other TypeScript files.
Http backend api services should return domain objects instead of a backend dict.
Write documentation on various TypeScript conventions used.

Along with these goals we also realised that the use of ts-ignore shoould also be restricted. So, I also added a lint check that restricted the use of ts-ignore and using ts-expect-error at relevant places.

Also, as the types would be in place I added the checks ensuring that any type is not used anymore.

PRs involved

Documentation

I wrote a guide on defining types and published it in Oppia wiki. You can read it here.

Milestone 3

The work done in this milestone is

Integrate dependencies into webpack.
Increase the webpack compilation speed.
Documentation on webpack config.
Enable more TypeScript eslint rules.
Setup strict type checks.

The main changes in webpack config for getting more speed were introducing cache-loader and use faster devtools in webpack. Also, I introduced a flag in the scripts so that developers would be still able to build using source-maps in webpack. The compilation time in production was reduced from around 600s to around 300s in Travis CI (production build). Also the compilation time for development build is less than 30s. Due to cache-loader consecutive builds in both production and development evironment now take around 20s only.

Also we thought that it would be nice to enable strict type checks in the TypeScript config. But the problem was the huge number of errors due to that. So, we decided to implement this rule gradually file by file. I set up that strict config and we plan to make this a good first issue.

PRs involved

Documentation

There was documentation on webpack already. I extended it to explain how our webpack config works. You can read it here.

Issues / Bugs found

I was also a part of release testing team in Oppia. Here are the various issues found by me while release testing and developing Oppia.

Summary

This was an awesome learning experience working with Oppia this summer. Special thanks to Vojtěch Jelínek who was my mentor for helping me whenever I faced any problem in completing this project. I would also like to thank Oppia for giving me this opportunity.

I would also like to acknowledge the help from other members of the community, who were always available whenever needed, just a small chat away. I strongly intend to continue contributing to Oppia.

Also, thanks to Google for this amazing program.

External Links

GSoC Project -> https://summerofcode.withgoogle.com/projects/#4778102950985728

Oppia Lightning Talks -> https://www.youtube.com/watch?v=9BEjYLbVyDs

How to clean scraped data?

Nishant Mittal — Mon, 03 Aug 2020 22:50:10 +0000

Is there a python library which can help to clean the data I got after scraping?

Completing the first milestone of my GSoC Project with Oppia

Nishant Mittal — Sat, 11 Jul 2020 12:48:24 +0000

I have passed the first milestone of Google Summer of Code 2020. It was a wonderful experience working with Oppia. I wrote this post to share the things I've learnt during these awesome four weeks.

So first of all let me tell you a bit about my work.

The Oppia's codebase is being migrated to Angular from AngularJs and is currently in a hybrid state. Due to that the codebase shifted from Javascript to Typescript. When the javascript files were being converted to Typescript. In some places the types were not declared and were left as any. There were many reasons to that one of them being the absence for proper conventions for the types.

Also, there were some third party libraries that didn't have type definitions. So, to be precise my work in the first milestone was to

Write type definitions for the third party libraries that didn't have those.
Coming up with a convention for declaring the types.
Declare types for about 50% of the typescript files.

Writing definitions for the third party libraries was a bit time consuming but was not too difficult. The one thing that I learnt about typescript during this task was Namespaces.

Initally, I planned to camelize the response of all the API endpoints. So, that the typescript files could have everything in camelCase. But soon realized that it was not feasible. Then after discussion with my mentor and Oppia core mantainers we decided to restrict the use of snake_case to certain typescript files. I learnt how important conventions were to ensure a readable and maintainable code.

After the conventions were finalized it was not hard to declare types in other places in codebase. But in some places where the types could be complex. I learnt some awesome things about typescript like Union Types, Type Guards, Discriminated Unions, Conditional Types.

I was able to complete the above tasks well before time (because I started the work bit early than the official date ;))

Summing up, it was a month full of learning and I am looking forward to working on the second milestone of my project.

My Pull Requests To Oppia
GSoC Project

How do you put data for other people to use?

Nishant Mittal — Thu, 09 Jul 2020 22:41:18 +0000

Suppose you have scraped data from a site in JSON format which can be also used by other people. How do you expose it?
Do you make a url directly give out that JSON data? Or there is a better way. I was thinking of something like a GraphQl server. What do you guys think?