teleren/devto huggingface dataset:
Embed Vite React in Golang binary, with live reload!
Tags: go, vite, react, fullstack
Published: 2023-08-13 11:37:40

I recently followed this [excellent article](https://dev.to/pacholoamit/one-of-the-coolest-features-of-go-embed-reactjs-into-a-go-binary-41e9) from [Pacholo Amit](https://dev.to/pacholoamit), he documents a method where you can embed the static assets built from Vite using the Echo framework in go, into a single binary.

Whilst his solution was great, it was missing something still for me, I like to be able to make changes in code / css and have it instantly updated in the browser, being able to see the frontend change with live reload is a must have.

I created an example project of my own that starts of using his method but then adds a live reloading method in the first Pull Request https://github.com/danhawkins/go-vite-react-example

## The Solution

I solved it in [this pr](https://github.com/danhawkins/go-vite-react-example/pull/1) where we run the Vite dev server alongside a proxy mode of the echo server in Golang, meaning that we proxy all requests that are relevant directly to the vite server, but we only do this in dev mode.

In our case dev mode is defined by the environment variable ENV being "dev".

The first step is to create a .env file

```bash
ENV=dev
```

Then we update the frontend.go file likes so
```golang
package frontend

import (
	"embed"
	"log"
	"net/url"
	"os"

	_ "github.com/joho/godotenv/autoload"
	"github.com/labstack/echo/v4"
	"github.com/labstack/echo/v4/middleware"
)

var (
	//go:embed dist/*
	dist embed.FS

	//go:embed dist/index.html
	indexHTML embed.FS

	distDirFS     = echo.MustSubFS(dist, "dist")
	distIndexHTML = echo.MustSubFS(indexHTML, "dist")
)

func RegisterHandlers(e *echo.Echo) {
	if os.Getenv("ENV") == "dev" {
		log.Println("Running in dev mode")
		setupDevProxy(e)
		return
	}
	// Use the static assets from the dist directory
	e.FileFS("/", "index.html", distIndexHTML)
	e.StaticFS("/", distDirFS)
}

func setupDevProxy(e *echo.Echo) {
	url, err := url.Parse("http://localhost:5173")
	if err != nil {
		log.Fatal(err)
	}
	// Setep a proxy to the vite dev server on localhost:5173
	balancer := middleware.NewRoundRobinBalancer([]*middleware.ProxyTarget{
		{
			URL: url,
		},
	})

	e.Use(middleware.ProxyWithConfig(middleware.ProxyConfig{
		Balancer: balancer,
		Skipper: func(c echo.Context) bool {
			// Skip the proxy if the prefix is /api
			return len(c.Path()) >= 4 && c.Path()[:4] == "/api"
		},
	}))
}

```

We have a new condition in RegiserHandlers that checks if the env is dev and if so we call setupDevProxy.

All this does is create a balancer group with one member (the vite dev server) and use a skipper function if the path is prefixed with /api. This keeps out api routes isolated.

I found this to work really well so far, and the developer experience is the best I have had so far when working on fullstack web applications.
Azure Key Vault with .NET - Vault Access Policies
Tags: azure, keyvault, dotnet, csharp
Published: 2023-08-13 11:29:59

[Link](https://dev.to/ishwar398/azure-key-vault-with-net-creating-a-key-vault-resource-51ap) to the post explaining the creation of Azure Key Vault resource.

Now, we will see the Vault Access Policy setup in detail.

Key Vault has to be accessed from any where. Be it App Service, Functions, Azure VM etc.
We need to ensure that all these services can access the Key Vault to read the secrets without any authentication error.

If the Key Vault Access Policies has been selected to ensure that access policies are added for all the resources which have to connect to the Key Vault.

This is a two step process:

## Assign a system id to the resource which will access the Key Vault resource

- We need to make sure that a System ID is assigned to the resource for which we will create an access policy
- Open the Overview page of the Azure Resource

![Overview page of the application](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xyw2bsgs863kek15c1sa.png)


- Click on Identity from the left pane
- In the System Assigned section, turn on the Enabled button.
- Click on Save.
- Once the save is successful, an Object (Principle) ID will be assigned to the resource.

![Enable the System Assigned Identity for an application](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/olitc3fcqte6nrmsgdho.png)


## Creating the access policy

- Open the Azure Key Vault resource overview and click on the Access Policies option in the left pane.

![Click on Access Policies](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ygt1r2o8nknynxf5uhoy.png)

- Click on 'Create(+)' button
- The next step is to grant permissions
- The permissions are divided in 3 parts: Keys, Secrets, Certificates
- You can select from pre-defined templates or assign the permissions you need. 
- Example, if you want an application to just read and get list of the secrets, then just provide Get and List permission under the Secret option.

![Assign what access are to be provided](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3puq2m5ekrp4vrj5n7ue.png)

- Paste the Object(Principle) ID from the first step in search, it will bring the result.

![On pasting the Object ID, we get the application in the result](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/27nqejb9tcvx894ueio5.png)

- Select the application and click on Next. (Multiple applications can be selected here)

- Since we have already selected the applications, skip the 3rd step

- Create the access policy

Once this policy is created, the selected application will now get all the selected accesses to the Key Vault Resource.
Navigating the Cloud with Digital Titans
Tags: mainframe, api, integration, ai
Published: 2023-08-13 11:17:33


[_mWtech ](https://middlewaretechnologies.co.za/)Mainframe Masterpieces_


In the vast landscape of technology, where binary interacts with hexadecimal and servers exchange knowing signals, mWtech unveils a connection like no other: the seamless fusion of mainframe applications and cloud-based APIs. It's a collaboration so refined, so in sync, that even the most emotionless of computers might feel a virtual thrill.

**Mainframe Mastery: A Concerto of Reliability**
Mainframes, those digital behemoths of the past, continue to stand tall in mWtech world. They're not outdated; they're conductors orchestrating a concerto of data, dependability, and efficiency. But what if these mainframes could dance with the clouds? Enter mWtech mainframe applications, poised to be called from the celestial realms of the cloud.

**Summoning from the Cloud: A Technological Spell in API Form**
With a skillful move by a developer and a precise API call, mWtech mainframe applications can be summoned from the cloud as effortlessly as a magician produces a rabbit from a hat. Need to tap into a legacy database? Just utter the correct API spell. Want to merge a mainframe application with a contemporary web service? A straightforward cloud-based incantation will suffice.

**Elegant Integration: A Gathering of Eras**
mWtech services connecting mainframes to the cloud are not merely a technological achievement; they're a gathering of eras, a graceful fusion that marries the wisdom of mainframe applications with the nimbleness of the cloud. It's a performance on a digital stage, where tradition greets innovation, and stability dances with adaptability.

**Security: A Stronghold in the Sky**
Fear not, esteemed reader, for this dance is performed within a stronghold in the sky. mWtech's security measures ensure that the mainframe's secrets are shared only with those who possess the secret code (or the proper credentials).

**Conclusion: A Cordial Invitation from mWtech**
mWtech extends an invitation to join this technological rendezvous, where mainframes and clouds glide across the digital arena, guided by the graceful hand of API integration. It's a dance of strength, elegance, and a hint of enchantment.

So don your virtual dancing attire and embrace the hand of mWtech mainframe masterpieces. The music is resonating, the cloud is beckoning, and the dance floor is ready.


[![expose legacy functions as microservices with minimal impact](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6jlbs2josofgqfxp517q.png)](https://middlewaretechnologies.co.za/)

_Disclaimer_: While the enchantment is plentiful, the technology is tangible. Reach out to an mWtech representative to discover how our mainframe applications, cloud integration, and APIs can transform your operations. Dance lessons not included.
Checklist
Published: 2023-08-13 11:04:45

I am more than halfway on first day, so building a checklist right now. Updatable

I am taking the topics from GFG which were most elaborative

## Data Structures 
- Maths - GCD, Prime nos, etc
- Bit Manipulation + Bitset
- Array
- String
- Stack
- Queue
- Deque
- Linked List and its flavors
- Tree
 - Binary Tree
 - Binary Search Tree
 - AVL Tree (optional)
 - Red Black Tree (optional)
 - Binary Indexed Tree & Segment Tree (optional)
- Graph
 - TBD
- Heap & Priority Queue
- Disjoint Set

## Algorithms
- Searching
- Sorting
- Hashing
- Dynamic Programming
- Recursion & Backtracking
- Greedy
- Complete Search
- Path
 - DFS, BFS
 - Dijkstra
 - Bellman Ford
 - Prim & Kruskal
 - Minimum Spanning Tree
 - A* (optional)
- Complexity Analysis
Token refresh implementation with Ktor in Kotlin Multiplatform Mobile
Tags: refreshtoken, ktor, koin, kotlinmultiplatform
Published: 2024-01-21 05:28:39

---
title: Token refresh implementation with Ktor in Kotlin Multiplatform Mobile
published: true
date: 2023-08-13 10:58:31 UTC
tags: refreshtoken,ktor,koin,kotlinmultiplatform
canonical_url: https://medium.com/@lahirujay/token-refresh-implementation-with-ktor-in-kotlin-multiplatform-mobile-f4d77b33b355
---

Hey everyone, This is a short step-by-step guide for integrating a token refresh implementation with Ktor in Kotlin Multiplatform Mobile. [**Ktor**](https://ktor.io/) offers an easy and straightforward approach to implementing a token refresh feature and managing the lifecycle of tokens. Without any further delay, let’s dive right in.

In this example, I will also be using [**Koin**](https://insert-koin.io/) DI framework to get **HttpClientEngine** (_platform-specific engine for processing network requests_) and a secure store for storing and retrieving tokens (_called_ _UserManager_).

#### Prerequisites

> [Kotlin Multiplatform Mobile with Koin](https://insert-koin.io/docs/quickstart/kmm/)

> [ktor](https://ktor.io/)

> [Napier](https://github.com/AAkira/Napier)

Add dependencies

![](https://cdn-images-1.medium.com/max/1024/1*Zs0Rz0ZByB1NIby0o8OUdQ.png)

#### Implementation

First we will assume that we have configured Koin DI for our KMM project. Then we will configure the platform specific Ktor **HttpClientEngine** with **OkHttp** for Android and **Darwin** for IOS.

In **commonMain** define your expected declaration for **HttpClientEngine**.

![](https://cdn-images-1.medium.com/max/1024/1*Jo5PDX7L76i6MfnNUxTTSw.png)

In **AndroidMain** , define your platform-specific actual declaration for the **HttpClientEngine**.

![](https://cdn-images-1.medium.com/max/1024/1*U4As6l6OvcARBmOVGFldIg.png)

In **IosMain,** define your platform-specific actual declaration for the **HttpClientEngine**.

![](https://cdn-images-1.medium.com/max/1024/1*LhVrIl4k2y8YYCDVMjqrtA.png)

Then add your declaration to the **startKoin** function.

![](https://cdn-images-1.medium.com/max/1024/1*jJQuRQ9d1UDu5BnemmUMnQ.png)

#### Token Refresh

Our next step will be to configure the token refresh feature using the **refreshTokens** ktor API.

![](https://cdn-images-1.medium.com/max/1024/1*skJwwrF0zVvRs7WURuo1ig.png)

Full **HttpClient** configuration,

![](https://cdn-images-1.medium.com/max/1024/1*LDnqp7ajbM-xv4O70rr4NQ.png)

Accordingly, what this code does is. A request will be made with a token to the protected API. API will respond with a 401 unauthorized response if the token is expired, and this will trigger the refreshTokens block to retrieve new tokens. Once the token has been retrieved, it will request the same protected API that previously responded with a 401 unauthorized response.

> Code Snippets — [https://gist.github.com/stargatex/7678d15a6e7bef0b3cf1262f38a7a31d](https://gist.github.com/stargatex/7678d15a6e7bef0b3cf1262f38a7a31d)

I hope you found this useful. Until next time 🙏 👋
New way of creating vue PWA
Tags: vue, pwa, vite, vuecli
Published: 2023-08-13 10:46:16

I have read and practice the use of vuejs its really a good framework togo with. Now I want to start a new vue **PWA** project, according to many post its recommended to use vue CLI pwa plugin but on reaching the official page of vue, they make it clear that vue CLI is under maintenance suggesting create-vue. So, How can I use this most recommended way to achieved my pwa with vue? Thank you in advance.
React Query: Road Map For Mastering React Query!
Tags: javascript, react, webdev, beginners
Published: 2023-08-13 10:44:31

**React Query** is a powerful library for managing and caching asynchronous data in React applications. It's commonly used for _fetching and updating data from APIs, handling caching, and managing the state of your data._

To get started, here's a roadmap you can follow to learn **React Query:**

**Prerequisites**:
Make sure you have a good understanding of React, including components, hooks, and state management using useState and useEffect.


**Installation:**
Start by installing React Query in your project. You can use npm or yarn for this:

```
npm install react-query
# or
yarn add react-query
```

**1. Basic Concepts:**

Learn about the core concepts of React Query:
- **Queries**: Fetching and caching data.
- **Mutations**: Updating data on the server.
- **Infinite Queries**: Paginating large data sets.
- **Query Keys**: Identifying queries and data.
- **Query Client**: The main context for queries and mutations.



**2. Queries:**
- **useQuery**: Fetch data using the useQuery hook.
- **Query Function**: Define a function that fetches data.
- **Query Options**: Customize the behavior of queries.
- **Caching: React**: Query handles caching automatically.
- **Invalidations**: Manually invalidate cache when data changes.



**3. Mutations:**

- **useMutation**: Perform server-side updates using the useMutation hook.
- **Optimistic Updates**: Update the UI optimistically before the server responds.
- **Invalidations**: Automatically update cache after a successful mutation.



**4. Infinite Queries:**

- **useInfiniteQuery**: Handle paginated data using the useInfiniteQuery hook.
- **Pagination Function**: Define a function that fetches paginated data.
- **Scrolling**: Load more data as the user scrolls.



**5. Advanced Topics**:

- **Prefetching**: Fetch data in advance to improve user experience.
- **Query Retries and Error Handling**: Handle failed requests gracefully.
- **Background Data Sync**: Keep data up-to-date in the background.
- **Server-Side Rendering (SSR)**: Use React Query with server-side rendering.

**6. React Query Devtools**:

Install and use the **React Query Devtools** to visualize and debug your queries and cache.


I hope u have liked this article any questions related to this I would love to answer those you can find me on [Twitter](https://twitter.com/amangupta_jsx) let’s connect.
Brief Introduction to PostgreSQL
Tags: bitnine, apacheage, postgres, devcommunity
Published: 2023-08-13 10:27:53

## What is PostgreSQL
It is an object-relational database management system based on Postgres Version 4.2 developed by University of California at Barkeley Computer Science Department.

It support large part of the SQL standard and offers many modern features and It is an open source.
- Complex Queries
- Foreign Keys
- Triggers
- Updatable Views
- Transaction integrity
- Multiversion Concurrency Control

PostgreSQL can be extended by the user in many way:

- Data types
- Functions
- Operators
- Aggregate Functions
- Index Methods
- Procedural Languges

PostgreSQL can be used modified and distributed by anyone free of charge for any purpose, be it private commercial and academic.

## Brief History of PostgreSQL
PostgreSQL previously called The object-relational database management system derived from Postgres package written in University of California at Berkeley. Now PostgreSQL is now the most advanced open-sources database available anywhere.


**Postgres95**
In 1994, Andrew Yu and Jolly Chen added an SQL Language interpreter to Postgres. Under a New name Postgres95 and subsequently released to the web to find its own way in the world as an open-source descendant of the original Postgres Berkley code.

**PostgreSQL**
In 1996 name was changed from Postgres95 to PostgreSQL to reflect the relationship between the original Postgres and the more recent versions with SQL capabilities. 

**Convention**
The following conventions are used in the synopsis of a command.
- Brackets "[ and ]" which Indicates optional parts.
- Braces "{ and }" and vertical lines "|" indicate that you must choose one alternative. 
- Dots "..." indicated that the preceding element can be repeated.
And all other symbols including parentheses should be taken literally.

SQL commands are preceded by the prompt =>, and shell commands are preceded by the prompt $. Normally, prompts are not shown through.

## Bug Reporting Guidlines
Big report plays an important role in making PostgreSQL more reliable because even the utmost care cannot guarantee that every part of PostgreSQL will work on every platform under every circumstances.

## Identifying Bugs
- A program terminates with a fatal signal or an operating system error message that would point to a problem in the program.
- A program produces the wrong output for any given input
- A program refuses to accept the valid input.
- A program accepts invalid input without a notice or error message
- PostgreSQL fails to compile build or install according to the instructions on supported platforms
How to completely uninstall MongoDB from your Ubuntu machine by following these steps
Tags: mongodb, ubuntu, devops
Published: 2023-08-13 10:27:24

When it comes to databases MongoDB has established itself as a data storage solution. However there may be instances where you need to remove MongoDB from your Ubuntu machine. Whether you're transitioning to a database system or experiencing difficulties, with your MongoDB setup it's important to ensure a thorough uninstallation to avoid lingering problems.

Incomplete uninstalls can cause issues, including wasted disk space and conflicts with software. They can also make it challenging to reinstall MongoDB or another database system in the future. If your aim is to perform an uninstallation it's crucial to do it. This article will provide you with step by step instructions on how to remove MongoDB from your Ubuntu machine guaranteeing a start for your upcoming database endeavors.

Within this article, I'll be offering you a guide, on bidding farewell to MongoDB on your Ubuntu machine in the efficient and hassle free manner possible. 

PS: After this, you can always install a different version or fresh copy, if you like.

Steps 👇🏽👇🏽👇🏽

Before uninstalling MongoDB ensure that the MongoDB service is stopped if it is currently running. You can achieve this by executing the command:

`sudo systemctl stop mongod
`
remove the MongoDB packages by utilizing the package manager (apt):
`sudo apt remove mongodb-org mongodb-org-server mongodb-org-shell mongodb-org-mongos mongodb-org-tools
`

Now, go ahead to remove any remaining configuration files and dependencies. Use the apt purge command to remove the MongoDB packages:

```
sudo apt purge mongodb-org
sudo apt purge mongodb-clients mongodb-org-database mongodb-org-server
sudo apt purge mongodb-database-tools
```

If you want to completely remove all data and log files associated with MongoDB, you can remove the MongoDB data directory:
`sudo rm -r /var/lib/mongodb
`
_-Be cautious with this step, as it will permanently delete your MongoDB data.
_
You can also remove the MongoDB user and group if you no longer need them, This is an optional step, if you decide to make use these elements:

```
sudo deluser mongodb
sudo delgroup mongodb
```

Remove any remaining MongoDB configuration files:
`sudo rm /etc/mongod.conf
`
Take out any MongoDB ordinary commands and shell scripts:

```
cd /usr/bin
rm -r mongo*
ls
```


![confirming removal of any Mongo shell scripts in your Linux Bin](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8ywlr8zoz356yo4u5zvg.png)

Cleanup your dependencies by updating the package list and remove any leftover packages that were dependencies of MongoDB:
`sudo apt autoremove
`

Confirm that MongoDB has been removed:
`dpkg -l | grep mongodb`

Good luck ✨✨✨
GSoC Week 9-10
Tags: gsoc
Published: 2023-08-13 10:23:47

Big progress on the front of algorithm working. Turns out there wasn't that much of a problem in the algorithm. I just had to subtract the mean from the data before taking the fourier transform. The Lomb Scargle seems to work on data that has mean subtracted from it. Furthermore they dont seem to work that well or at all in full spectrum. 
The LSFT also is highly sensitive to the time intervals that are input to it. I have found some more clues as to how to make it even better. I will expound upon this further within 2 weeks since my final exams are going on and I have limited time.

Minimum Working Code Example

```
def data_func(time, freq=1.2324235252):
    return  2 * np.sin(2 * np.pi * time * freq)

t0 = 0
t1 = 100
dt = 0.1

np.random.seed(43)
time_uniform = np.arange(t0, t1, dt)
time_nonuniform = np.sort(np.random.uniform(t0, t1, time_uniform.size))

npft = np.fft.fft(data_func(time_uniform))
npfreqs = np.fft.fftfreq(npft.size, dt)
npft = npft[npfreqs>=0]
npfreqs = npfreqs[npfreqs>=0]
lsfreqs = np.linspace(np.min(npfreqs), np.max(npfreqs), npfreqs.size * 8)
lsfreqs = lsfreqs[lsfreqs>=0]
np.random.seed(43)
lsft_slow_arr = lsft_slow(data_func(time_nonuniform), time_nonuniform, lsfreqs,sign=-1, fullspec=False)
lsft_fast_arr = lsft_fast(data_func(time_nonuniform), time_nonuniform, lsfreqs,sign=-1, fullspec=False,oversampling=10)
plt.plot(time_nonuniform,lsft_slow_inv(lsft_slow_arr,freqs=time_nonuniform, t=lsfreqs).real ,alpha=0.5,label="Slow")
plt.plot(time_nonuniform,lsft_fast_inv(lsft_fast_arr,freqs=time_nonuniform, t=lsfreqs).real,alpha=0.5,label="Fast")
plt.plot(time_nonuniform,data_func(time_nonuniform),label="Original Data")
plt.legend()
plt.xlim(0,10)
plt.ylim(-3,3)
```


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g10l11a0u36xzhtkq5n5.png)