The Ops Community ⚙️: Akilesh

Digital Ocean DNS Config

Akilesh — Thu, 02 Jun 2022 17:23:36 +0000

We will be creating a droplet in the digital ocean with a docker container running on it and on top of its IP address we will be adding our Domain Name System.

Purchase a domain

To set up a domain name, you need to purchase a domain name from a domain name registrar ex : GoDaddy, Namecheap, Google Domains etc…
I did purchase my domain using Namecheap, but other registrars will also offer the same features.

Set up DNS

Choose your domain name which needs to be configured and set up custom DNS records to make DigitalOcean accessible be your domain name registrar.

Add this below configuration to your DNS record.

ns1.digitalocean.com
ns2.digitalocean.com
ns3.digitalocean.com

Save the settings and wait for a minute or so for DigitalOcean to identify your DNS.

Now we are ready to move on to connecting the domain with your Droplet in the DigitalOcean control panel.

control panel

Assuming that you have been already created a droplet with some content in it and could be able to preview the content through its IP address on the web.

Moving to our digital ocean control panel we can choose the Add a domain option from the dropdown

Add your domain name in the text area then click the button to create a new record.

New record

to b continued 🚧

Plausible Manual Setup

Akilesh — Tue, 31 May 2022 17:31:24 +0000

From the previous post, you know that plausible is a simple, lightweight, open-source alternative to Google Analytics.

Check out their service, which offers a variety of features and seamless integration in under two minutes.

We will self-host plausible in a cloud. All the configurations and the services used in this post could be modified according to your needs.

Digital Ocean

You need a digital ocean account to create a cloud server.

You can feel free to choose your own cloud service provides (AWS, Azure,...) to create a instance.

Droplet

Create a new droplet aka server by clicking the
Create > Drolets.
Choose a Linux distributor you are good at using. I'll choose Ubuntu.
Choose a datacenter region located close to your current location.
The authentication process in the cloud is a tricky one. We will use the SSH key to secure our droplet to know more about how to connect using SSH. Refer to this blog.
All the setting up process is done, you can click the create a droplet and wait for a few minutes until the droplet gets ready to run.

Droplet Console

For the shake of our covenant, we will use an inbuilt web - based terminal console to access our droplet.

1) Lets first clone the plausible/hosting repo.

$ git clone https://github.com/plausible/hosting
$ cd hosting

2) We have access to mess with two files and explore what they need to offer docker-compose.yml & plausible-conf.env

In plausible-conf.env we need to fill the required parameters
for these placeholders.

ADMIN_USER_EMAIL=replace-me
ADMIN_USER_NAME=replace-me
ADMIN_USER_PWD=replace-me
BASE_URL=replace-me
SECRET_KEY_BASE=replace-me

SECRET_KEY_BASE Now to set the parameters we'll first need a random 64-character secret key which will be used to secure the app. Use the below command to generate one.

$ openssl rand -base64 64 | tr -d '\n' ; echo

Now edit plausible-conf.env and set SECRET_KEY_BASE to your secret key.

BASE_URL It should be the base URL where this instance is accessible, including the scheme (e.g. http:// or https://), the domain name, and, optionally, a port. If no port is specified the default 8000. ex: https://1x9.5x.x6.x4:8000
ADMIN_USER You just fill your details email id, User name: Password (PWD).

Reference

ADMIN_USER_EMAIL=2112akilesh@gmail.com
ADMIN_USER_NAME=akilesh
ADMIN_USER_PWD=xxxxxxxxxx
BASE_URL=https://1x9.5x.x6.x4
SECRET_KEY_BASE=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

Start the server

Docker installation commend on ubuntu

$ apt install docker-compose

Once you've entered your secret key base, base URL and admin credentials, you're ready to start up the server:

$ docker-compose up -d

This commend will execute the following process:

Creates a Postgres database for user data
Creates a Clickhouse database for stats
Runs migrations on both databases to prepare the schema
Creates an admin account (which is just a normal account with a generous 100 years of free trial)
Starts the server on port 8000

To check your docker status, run this commends in your terminal:

sudo systemctl status docker

You can now navigate to http://{hostname}:8000 and see the login screen.

After logging process, add your domain to plausible and repeat the process that we did in their paid tier.Reference.

History Repeats🔄

Plausible in minutes

Akilesh — Mon, 30 May 2022 10:04:31 +0000

Plausible is a lightweight web analytics tool used to check your web traffic and also pinpoints from where the traffic comes from with clear visual charts and Email/Slack reports.

In this blog I used next.js for reference to show how plausible works, but plausible will work on any framework.

Login/Create

Create a plausible account to get started and click the add website button.

Add a website

Enter your domain name in the text area (provide the domain name which you have access to) and location will be automatically set accordingly to your device location.

Code snippet

A code snippet will be generated from our previous details, and it needs to be pasted in our project's head.

Let's add this script to our project in our way.

Create a meta.tsx file under the components directive and paste the below snippet.

import Head from 'next/head'

export default function Meta() {
    return (
        <Head>
            <script
                defer
                data-domain="akilesh.io"
                src="https://plausible.io/js/plausible.js">
            </script>
        </Head>
    )
}

Now you can import this meta component to your layout.tsx component if you have one. If not, you can add it to this component to other components which have access to all the pages.

The ides here is to make the <script> tag accessible by the whole application.

Domain dashboard

Go to your domain dashboard https://plausible.io/**your_domain_name** and stay relaxed. Plausible will handle all the complicated process and in a few seconds you will see your webpage's stats.

Screen shot:

This will be your dashboard until you get someone to visit your website.
This is a line chart represents about the total visitors and also will identify unique visitors from the total traffic then the duration of the visiting period.
This dashboard will give a detail representation
Top Sources (From where the traffic comes).
Pages (On what page the user entered, exit).
Location.
Devices, Browser, OS.

Sentry with Next.js

Akilesh — Sat, 28 May 2022 17:06:59 +0000

In this blog we will see how to integrate sentry into an existing next.js application.

Installing

Add Sentry’s Next.js SDK to your next.js projects.

yarn add @sentry/nextjs

Automatic Configuration

npx @sentry/wizard -i nextjs

Choose your project from below listed options on your CLI then the setup wiz will automatically create configuration file's with default values and your API key.

Generated file's:

sentry.client.config.js
sentry.server.config.js
.sentryclirc (Where the token key will be stored)
sentry.properties
next.config.wizardcopy.js (if next.config.js already exists).

Modify next.config.js

If next.config.js does already exist in your project, the app will automatically create a next.config.wizardcopy.js then we'll need to manually copy the snippet into next.config.js.

Paste this snippet in your next.config.js

/** @type {import('next').NextConfig} */
const { withSentryConfig } = require( '@sentry/nextjs' );

const nextConfig = {
  reactStrictMode: true
}

const sentryWebpackPluginOptions = {
  // Additional config options for the Sentry Webpack plugin. Keep in mind that
  // the following options are set automatically, and overriding them is not
  // recommended:
  //   release, url, org, project, authToken, configFile, stripPrefix,
  //   urlPrefix, include, ignore

  silent: true, // Suppresses all logs
  // For all available options, see:
  // https://github.com/getsentry/sentry-webpack-plugin#options.
};

module.exports = withSentryConfig( nextConfig, sentryWebpackPluginOptions );

Backend

In an application to capture errors and monitor server performance of the API, we will wrap the handlers with a Sentry function.

Syntax:

import { withSentry } from '@sentry/nextjs';

const handler = async (req, res) => {
  // your API calls...
}

export default withSentry(handler);

Reference:

import type { NextApiRequest, NextApiResponse } from "next"
import { withSentry } from "@sentry/nextjs";

const handler = async (req: NextApiRequest, res: NextApiResponse) => {
  res.status(200).json({ name: "Akilesh" });
};

export default withSentry(handler);

Testing

To check every thing works fine, we will trigger a button click event in a frontend component that throws an error.

            <button type="button" onClick={() => {
              throw new Error("Sentry Frontend Error");
            }}>
              Throw error
            </button>

Now check your sentry dashboard to know more about the errors and performance metrics.

Deployment (Vercel)

Assuming that your next.js project has deployed on vercel.
Add environment variable to your project in vercel Project Settings > General > Environment Variables

SENTRY_AUTH_TOKEN: in environment variable with your sentry auth token which will be present in your .sentryclirc file.

Stay Tuned For Advanced Deployment Configuration.

Reinforcement learning in Super Mario bros Pt.2

Akilesh — Sat, 28 May 2022 01:35:32 +0000

Before getting here you should setup & preprocess the environment tap your index or thumb finger hovering on me

We are building an AI 🤖 to play 🎮 Super Mario Bros by reinforcement learning method and RL has four key elements.

Agent 🕵️

Agent can take some action in an environment to have some rewards or penalties.
Reward 🏆

depending upon agent action he will get a reward or a penalty
Environment 🖼️

The place where all happens. Agent does specify work according to the AI by analyzing environment and reward or penalty is given by how good or bad does the agent perform in that environment.
Action 🎬

The task given to the agent do certain tasks.

The Algorithm we use is PPO Proximal Policy Optimization

🚂 Train the model to play

import os 

from stable_baselines3 import PPO

from stable_baselines3.common.callbacks import BaseCallback

Here we are importing os to work with our file which helps when we save our model every 10000 games or steps so we can have a backup of our progress.

Imported our main Algorithm PPO that will be used to train our AI model or reinforcement learning model

then we imported Base Callback

To save the model 💾

class TrainAndLoggingCallback(BaseCallback):

    def __init__(self, check_freq, save_path, verbose=1):
        super(TrainAndLoggingCallback, self).__init__(verbose)
        self.check_freq = check_freq
        self.save_path = save_path

    def _init_callback(self):
        if self.save_path is not None:
            os.makedirs(self.save_path, exist_ok=True)

    def _on_step(self):
        if self.n_calls % self.check_freq == 0:
            model_path = os.path.join(self.save_path, 'best_model_{}'.format(self.n_calls))
            self.model.save(model_path)

        return True

The above step is optional you can skip it if you need. The process happening in the above step is we are saving the trained data at a set of callback intervals. So if we need we don't need to train the model again we can reuse this. Make sure you have enough storage space the model produces a hefty amount of data.

Locate file 📁

CHECKPOINT_DIR = './train/'
LOG_DIR = './logs/'

We are specifying where the produced data is located at

Setup Callback 📞🔙

callback = TrainAndLoggingCallback(check_freq=10000, save_path=CHECKPOINT_DIR)

This is just the instance of the TrainAndLoggingCallback(). What we are doing here is to save our model every 1000 steps or every 1000 games

We just have it as a backup for future reference else we need to re-run the whole training process.

We are going to setup our PPO model 💃

model = PPO('CnnPolicy', env, verbose=1, tensorboard_log=LOG_DIR, learning_rate=0.000001, 
            n_steps=512)

What we have done is create a variable called model and set that to PPO which is our model and passing parameters:

CnnPolicy- It is like a computer-based brain like a Neural Network in deep learning. A bunch of neurons communicate with each other and learn the relationship between different variables. Then there are various policies for different tasks. We used CnnPolicy because when it comes to image-based problems this model has its upper hand,
env - Our environment which we preprocessed.
verbose=1 - This gives us the data when we train the model. like setting it to 0 no output, 1 info, 2 debug.
tensorboard_log=LOG_DIR - This helps us to view the metric of how our training is performing as we are running our model.
learning_rate=0.000001 - The learning rate, can be a function of the current progress remaining.
n_steps=512 - The number of steps to run for each environment per update.

The hardest thing in any deep learning or machine learning is Getting the data in the right format.
This one-line code created a temporary AI model.

AI model starts to learn 📖

model.learn(total_timesteps=100000, callback=callback)

This is where our AI model starts to learn we are passing some parameters:

total_timesteps=100000 - The total number of samples (env steps) to train on.
callback=callback - called at every step with the state of the algorithm.

You will get some details about the current process while running model.learn.

If you see the above then you are good to go else check the previous step or do it as a developer does stackoverflow it.

Let's break down the resulting log by just taking look at some important values to notice.

fps : Frame Per Second
iterations : Number of times the process repeated.
time_elapsed : How long it been training for.
total_timesteps : How many frames our model goes through.
Training Metrics :

entropy_loss (⬇️) : In reinforcement learning, a similar situation can occur if the agent discovers a strategy that results in a reward that is better than it was receiving when it first started, but very far from a strategy that would result in an optimal reward.

explained_variance (⬆️) : The explained variance is used to measure the proportion of the variability of the predictions of a machine learning model. Simply put, it is the difference between the expected value and the predicted value.

learning_rate (📚): It is a tuning parameter in an optimization algorithm that determines the step size at each iteration while moving toward a minimum of a loss function.

loss (⬇️) : loss is the value of the cost function for our training data.

value_loss (⬇️) : val_loss is the value of cost function for our cross-validation data

Finally ✨

Load model ⌛

model = PPO.load('./train/best_model_1000000')

We are loading the trained model to our algorithm and saying the PPO algorithm to use that specific trained model to play Mario in our case it's best_model_1000000.

Ai Plays Mario 🤖

state = env.reset()
while True: 

    action, _ = model.predict(state)
    state, reward, done, info = env.step(action)
    env.render()

Then we are starting our game and loop through the game. Previously we used some random actions to move Mario now we are using the model.predict(state) to predict according to the model and give certain actions to Mario.

Source Code

This article is created by referring to Nicholasrenotte works all credit goes to him.

Reinforcement learning in Super Mario bros

Akilesh — Sat, 28 May 2022 01:31:33 +0000

The main objective of this blog is to learn reinforcement learning by doing. We are going to make a Mario game to play by itself using Reinforcement Learning method.

📦Packages and tools used

⚙️Setup a mario environment

pip install gym_super_mario_bros nes_py

We are Installing gym_super_mario_bros & nes_py. gym_super_mario_bros package is used to set up our gaming environment where our Mario will save the Princess Peach 👸 from Bowser and have you remembered the controls in this game

Left dpad – Move left, enter pipe to the left of Mario.
Right dpad – Move right, enter pipe to the right of Mario.
Up dpad – Enter pipe above Mario or enter door behind Mario.
Down dpad – Crouch, Ground Pound (In the air), enter pipe below Mario.
A button – Jump, confirm menu selection.
B button – Jump, exit menu.
X button/Y button – Dash (Hold), launch fireball (Fire Mario only).

Haaa good old memories now back to our topic nes-py help us to build a virtual joypad for python for our model to control Mario to do certain tasks.

⛓️Importing the required dependence

import gym_super_mario_bros

from nes_py.wrappers import JoypadSpace

from gym_super_mario_bros.actions import SIMPLE_MOVEMENT

Let's break down what does this three import does

import gym_super_mario_bros - is importing the game itself.
from nes_py.wrappers import JoypadSpace -
from gym_super_mario_bros.actions import SIMPLE_MOVEMENT - By default, gym_super_mario_bros environments use the full NES action space of 256 discrete actions. To constrain this, gym_super_mario_bros.actions provide three actions lists (RIGHT_ONLY, SIMPLE_MOVEMENT, and COMPLEX_MOVEMENT) we are using SIMPLE_MOVEMENT which has only 7 actions that help us to reduce the data we are going to process. actions are the combination of controls in the game.

(Bonus: Simplify the environment as much as possible the more complex it is the harder it is going to be for our AI to learn how to play that game. We will also convert the RGB image into a grayscale image which again helps us in reducing the data we need to be processed)

🎮Setting up the game

env = gym_super_mario_bros.make('SuperMarioBros-v0')
env = JoypadSpace(env, SIMPLE_MOVEMENT)

gym_super_mario_bros has various environments where we are going to train our model to learn and play. Feel free to check out different environments to play with. I am going to use SuperMarioBros-v0as the default classical environment.
SuperMarioBros-v0

SuperMarioBros-v2

SuperMarioBros-v3

Next we wrapper nes_py.wrappers.JoypadSpace with environmental and actions

🏃Run the game

done = True
for step in range(5000):
    if done:
        state = env.reset()
    state, reward, done, info = env.step(env.action_space.sample())
    env.render()

env.close()

The first thing we had done is done = True setting the flag to true. Tells whether the game needs to restart or not.

next looping through every single frame for step in range(5000): everything when a screen gets updated we say it to do specific actions.

To start the game env.reset().

env.step() to pass the action to the game like saying it to press a button to move right, left, etc...
env.action_space.sample() it gives random actions.

state, reward, done, info will return us some data to process with.

env.render() this allows us to show the game on the screen.

env.close() this allows us to close the game or terminate that game.

🥁result:

OSError: exception: access violation reading 0x000000000003C200 if you get any of these access violation errors just restart your Kernel and run the imports again this will do the job.

🔄Preprocess the game for applied AI

📦Installing packages for preprocessing

we need to preprocess the Mario game data before we train in our AI model. Two key preprocessing steps are grayscale and frame stacking

!pip3 install torch torchvision torchaudio

Install Pytorch
you can customize your installation process according to your hardware if you have CUDA-enabled GPU then follow the steps given in Pytorch website.
if you don't have one no worries just run the above command.

!pip install stable-baselines3[extra]

Next, we are going to install stable baselines an open-source project for implementations of reinforcement learning algorithms in PyTorch they provide various RL Algorithm to work with for this Mario game we are using (PPO) Proximal Policy Optimization algorithm to train our AI

📦Importing packages for preprocessing

from gym.wrappers import GrayScaleObservation

from stable_baselines3.common.vec_env import VecFrameStack, DummyVecEnv

from matplotlib import pyplot as plt

Our AI is going to take the images of the Mario game to learn
the color images (RGB) that have three times as many pixels to process so we convert them into grayscale images to process.
frame stacking helps our AI to have an idea of where Mario and enemies are by stacking the following frames.

🎁Wrapping the environment

env = gym_super_mario_bros.make('SuperMarioBros-v0')

env = JoypadSpace(env, SIMPLE_MOVEMENT)

env = GrayScaleObservation(env, keep_dim=True)

env = DummyVecEnv([lambda: env])

env = VecFrameStack(env, 4,channels_order='last')

GrayScaleObservation(env, keep_dim=True) - This commend helps to convert our environment from RGB to grayscale. keep_dim=True is used to obtain the final channel and it helps in frame stacking.
This process helps to reduce the number of pixels we need to process Let's take a quick look at how the color image contains.

RGB Image (240*256*3) = 184320 pixels to process
Grayscale (240*256*1) = 61440 pixels to process

env = DummyVecEnv([lambda: env]) - We wrap all the images in a dummy vectorization environment each time we run this step the shape of the data gets changed.

env = VecFrameStack(env, 4,channels_order='last') - We pass our preprocessed environment and how many frames we are going to stack in our case 4 you can add more if you need to and finally where our channel order is specified at by channels_order='last'.

stack shape is represented at the end.
code:
state = env.reset() state.shape
output:
(1, 240, 256, 1) = one channel
(1, 240, 256, 4) = four channels

Running the game

state = env.reset()

To get our current state in the game (basically the snapshot of the game at an index)

state, reward, done, info = env.step([5])

this step is explained in the Mario setup phase you can check above or if you are lazy enough to scroll to the top and find the specific para the same content is repeated below.
env.step() to pass the action to the game like saying it to press a button to move right, left, etc...
env.action_space.sample() it gives random actions.

In the above code, we give env.step([5]) herein SIMPLE_MOVEMENT array index:
[['NOOP'], ['right'], ['right', 'A'], ['right', 'B'], ['right', 'A', 'B'], ['A'], ['left']]
5th index action is to jump. just for making sure everything works fine, we are checking it out.

state, reward, done, info is the reward function in the environment the objective of the game is to move as far right as possible, as fast as possible, without dying.

state - Our current state in the environment
reward - A positive score gives when our Mario performs well in the game else NOPE. Our main goal is to maximize the total rewards.
done - It says whether Mario is dead or not, the game is over or not...
info - we get some information about the environment like {'coins': 0, 'flag_get': False, 'life': 2, 'score': 0, 'stage': 1, 'status': 'small', 'time': 400, 'world': 1, 'x_pos': 40, 'y_pos': 79}

🖼️ Frame Stacking

plt.figure(figsize=(20,16))
for idx in range(state.shape[3]):
    plt.subplot(1,4,idx+1)
    plt.imshow(state[0][:,:,idx])
plt.show()

This process is just to visualize how the stacking process works.

Jupyter on Docker

Akilesh — Sat, 28 May 2022 01:29:12 +0000

🐬Docker is like an isolated operating system where you can build and run all your development needs in a docker environment and we are going to install and run jupyter notebook from docker. Jupyter starts up a local Python server to serve these apps to your web browser.

1 (Get Image) 🖼️:

Get the Docker image of jupyter notebook from here

They have a list of different docker images for various needs

jupyter/base-notebook
jupyter/minimal-notebook
jupyter/r-notebook
jupyter/scipy-notebook
jupyter/tensorflow-notebook
jupyter/datascience-notebook
jupyter/pyspark-notebook
jupyter/all-spark-notebook

If you are just here to test things out you can try minimal-notebook it has the basic jupyter notebook features in small image size.
You can try jupyter/all-spark-notebook which has access to all the features but in cost to its larger image size. It depends upon your need but the steps are going to be the same for all.

For this post, I am using jupyter/scipy-notebook
First, we will pull the docker jupyter image to your local machine.

docker pull jupyter/scipy-notebook:latest

2 (Run Container) 🏃:

Next, we will run the image in a docker container.

docker run -it --name scipy-notebook -p 8080:8888 jupyter/scipy-notebook:latest

This will start a container that contains our jupyter scipy notebook image or whatever image you used.

3 (Navigate) 🧭:

navigate to your browser localhost port 8080 http://localhost:8080/ to access jupyter notebook in a browser.

4 (Bonus) ✨:

If you see any password or token required page in jupyter follow the step below else you can close this tab and play with jupyter notebook in docker.

Open your current running docker container which contains the image of the jupyter notebook and type:

jupyter notebook list

which will list out the current running notebook servers copy the token listen in the CLI and paste it in the jupyter token required page else scroll below and you can set a password with your token.