Got tired of entering the login credential again and again for IITJ WLAN. This blog will save you :)

The firewall authentication tab opened in chrome should remain running in background. Leave the tab open and do your stuff.

WLAN CRED is a chrome extension that automatically logs you in the firewall authentication of IITJ every time the window opens.

WLAN CRED Popup

This is an open-source project, you can check the GitHub repository here.

Your Credentials are stored in your browser only and WLAN CRED never shares or sends it out. 🔒

Step 1. Download the extension file from this link.

Step…


Last week I started building a Chrome extension for a product. The extension was built with React as a view engine to render a popup. So I thought to document it to make anyone getting started on this to get along.

In this blog, We will go through the process of building a Chrome extension using React. After this, you can add more functionalities to it very conveniently.

Link for Github Repository: https://github.com/onlyoneaman/chrome-extension-react

So Let’s get started.

Features of the extension

This extension can access your active tab and change the background colour of the page.

Before


In this blog, we will set up a simple Rails API App from scratch. We won’t be going through building models or controllers here.

Let’s install rails first, we will be using Rails 5.1 here for example, if you don’t have it run

gem install rails -v '~> 5.1'

And your rails version should be ready

To install rails, run the command below it has got flags to skip the parts we won’t need in our project. Run it now we will pick it apart next:

rails new repo-backend -T --skip-spring -C -M -d postgresql --api

Whew! That’s a mouthful…


Cookies

Cookies are small data strings, stored directly in the browser. They are included in the HTTP protocol.

As a rule, the web-server sets cookies with the help of a response Set-Cookie HTTP header. After that, the browser adds them to each request to the same domain, using the Cookie HTTP header.
Cookies are used in many cases to store information and sensitive-data, the most common being authentication
During the sign-in, the server applies the Set-Cookie HTTP header in the response for setting a cookie with a specific “session identifier”.

  1. The next time if the request is set to the same…


Universal Cookie

In this blog, we will be looking at how to work with cookies to setup authentication or session management in your web application.

Check this Session Management: Cookies vs localstorage for why we are using cookies to handle session management.

We can work with cookies via HTML or JS directly, but there are various npm packages to ease this out for us. We will use universal-cookies npm package for this.

npm install universal-cookie --save

a. After successful login response from the server, you have to set the authentication token in cookies, you can do that directly via server or…


Brief about localStorage

localStorage is a way to store data on the client’s computer. It allows the saving of key/value pairs in a web browser and it stores data with no expiration date. localStorage can only be accessed via JavaScript, and HTML5. However, the user has the ability to clear the browser data/cache to erase all localStorage data. Web storage can be viewed simplistically as an improvement on cookies, providing much greater storage capacity The available size is 5MB, which is more space to work with than a typical 4KB cookie. In addition with localStorage, the data is not sent back to the…


While working on an idea you want to invest most of your effort in building the business model and logic.

Generic Login Portal helps you in that way by giving you a head start on your frontend development. Just clone the repository on your system and change the API Url and boom!! You have a fully functional Login Portal.

A Login Portal is a basic and must to have to run your business and enable end-users to use your software. …


How to run rails server (or any server) on a VM?

  1. Make sure Nginx is installed. Else follow this simple guide first — https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-18-04
  2. Go to cd /etc/nginx/sites-available
  3. Add below details. Replace your server_name and proxy_pass (Where your server is running) with correct values
server{
server_name api.grambuddy.com;
location / {
proxy_pass http://localhost:3002;
proxy_http_version 1.1;
}listen 80;
listen [::]:80;
}

4. Create a symlink for it:

sudo ln -s /etc/nginx/sites-available/testapp /etc/nginx/sites-enabled/testapp

5. Restart Nginx:

sudo nginx -s reload

How to run service?

cd etc/systemd/system/<Create a new file - grambuddy-server.service> and enter the below details in it[Unit]
Description= instance to start grambuddy backend server
After=network.target[Service] …

React State and Lifecycle are very useful methods and with the advancement of React hooks and when a developer uses hooks instead of traditional React classes the most important question becomes how one is gonna implement the lifecycle methods offered by React classes in Hooks. We will look after the Hooks implementation of various lifecycle methods in this blog.

If you are new to state and lifecycle, Have a look at the official docs.
React State and Lifecycle. …

Aman Kumar

Learning nd Developing.

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