teleren/devto huggingface dataset:
Lovely Silk
Tags: 100daystooffload, silk, python, django
Published: 2023-09-22 18:55:09

I added a new tool to my toolbox this week, [Silk](https://github.com/jazzband/django-silk). Which is defined like this in their documentation.
 
> Silk is a live profiling and inspection tool for the Django framework.

As a maintainer of a Django project this is a great tool in many ways.

* Works seamless with [Django REST framework](https://www.django-rest-framework.org/)
* Can give you a good overview on how your endpoints are used
* See details about HTTP requests/responses
* Profiling
* SQL query details
* Statistics
* And more...

The tool is added as a regular middleware for a typical Django project, so it's pretty straightforward to add it.

First we need to install the `django-silk` package.

```sh
python -m pip install django-silk
```

After the package is installed we will need to update our list of middlewares in the `setting.py` file. The placement in the list can matter, read more about it [here](https://github.com/jazzband/django-silk#installation).

```py
MIDDLEWARE = [
   ...
   "silk.middleware.SilkyMiddleware",
   ...
```

We also need to add silk as an app.

```py
INSTALLED_APPS = (
   ...
   "silk",
   ...
)
```

To be able to use the front-end for Silk we will need to add its path to the `urls.py`.

```py
urlpatterns += [path("silk/", include("silk.urls", namespace="silk"))]
```

Since the tool is using the database to store its data we will also need to do a database migration.

```sh
python manage.py migrate

# And collect static files from each applications
python manage.py collectstatic

# Start the server
python manage.py runserver
```

Now you can start to explore all the nice things with Silk. The Silk UI is located at http://localhost:8000/silk. 

If you want to do some profiling you will need some more [configuration](https://github.com/jazzband/django-silk#profiling), which also is easy to get started with.

This is really a must have tool if you are doing anything with Django.

Give it a try!
My first contribution to other open source project
Tags: opensource, programming, python
Published: 2023-09-22 18:45:38

After learning how to review and test other open source project last week, I made my first contribution to other open source project!

After deciding the open source project [go-go-web](https://github.com/kliu57/go-go-web),I decided to add markdown files processing, so I created an issue first, and then I began to write my code. 

I totally did this in three steps, so I made three commits, which were "add version and revise README", "support md and parsing italic and bold" and "add test examples". In this process, I found it was hard for me to separate '\*' and '**', so I learned regular express again and tried a new way to solve it.

At first I directly git clone the origin repo and created the branch, but when I git push my code, it threw "fatal: Authentication failed for 'https://github.com/kliu57/go-go-web.git/", I always thought it should be done like this before. So I read the lab1 again and found I should fork the project on GitHub, then clone my fork. Next, create a branch on it. This helps me learn how to contribute to other's open source project.

Katie carefully read and tested my code and found a [bug](https://github.com/kliu57/go-go-web/pull/7) I didn't notice before, which teaches me that I need do more tests every time.

Katie also added an feature for my project who wrote a private function [convertLinks](https://github.com/WangGithub0/ConvertTxtToHtml/pull/8) which can parse the markdown links with a powerful function.

After my PR merged, I went to close my issue, but I found it doesn't automatic link my PR, so I search the [github doc](https://docs.github.com/en/issues/tracking-your-work-with-issues/linking-a-pull-request-to-an-issue) and using "close" to solve it.

In this whole process, I made a real contribution to other's project, and found many knowledge I should learn and practise.
2023-09-22: Login and registration
Tags: devjournal
Published: 2023-09-22 18:21:34

Another week another dollar.

We obviously determined localtunnel to not be a long-term solution because the tunneling only works as long as the process is running, which can terminate by itself for whatever reason.

In that case, our first task was to actually get our DNS to work. Our boss had had a testing subdomain already set up for the server, but it was getting overridden by the Cloudflare worker by mistake so we removed that.

Then we had to set up the nginx again for that subdomain, and it started redirecting to the server instead of the worker. However, we ran into Cloudflare issues with various different 500 errors.

The first one we had to deal with was SSL stuff. A lot of that stuff, our boss had to configure himself since he was the admin. After fiddling around with it for a day (via nginx, Cloudflare, etc.), we finally got that working, and the error message changed to a 502 Bad Gateway, which meant it was now the server's problem rather than SSL.

After tinkering around with ports and origin points on both with nginx and FastAPI, it finally got working again. It had something to do with how FastAPI needs to actually be running (duh), and that it receives regular HTTP from nginx rather than HTTPS.

After that, we started working on making the backend and frontend actually interact in a way that we want for the user signup and login.

Getting the endpoints correct was simple enough, but we ran into issues pretty quickly with "unprocessable entities" which required us to modify both ends inputs and outputs. Eventually we got it working to do both signups and logins, but the moment we enabled CORS again, we were stuck.

After a day and a half of debugging this, we figured that it was again a combination of nginx and FastAPI stripping off the CORS headers when sending back to the frontend, which got it throwing errors.

Once we had FastAPI manually add them back in and make sure nginx was also not stripping them off in the first place, it started working again. Once that was good to go, we brainstormed some test cases and user stories for the registration and logins and JWTs to make sure everything is working as expected.

Come Friday, we demoed our work to our COO and he was pleased with the progress. Our frontend developer also showed off new designs for the website with more information.

Otherwise, I think that's all I have to report this week. Until next time, cheers.
Cracking the LeetCode:392 Is Subsequence?
Tags: leetcode, java, cpp, programming
Published: 2023-09-22 17:55:08

**What is LeetCode 392: Is Subsequence?**
Before we dive into the intricacies of [LeetCode 392] (https://www.nileshblog.tech/leetcode-392-is-subsequence/), let's grasp the concept. This coding challenge, categorized as "easy," tests our ability to determine if one string is a subsequence of another. Think of it as a detective's quest to find clues in a larger mystery.
**Unpacking the Challenge**
Imagine you have two strings: s and t. Your task is to check whether s is a subsequence of t. In other words, can we derive string s by deleting some (or none) characters from string t while maintaining the order of characters in s? If we can, the answer is "yes"; otherwise, it's "no."
To illustrate this, let's look at an example:
**Example:**
* **s:** "abc"
* **t:** "ahbgdc"
In this case, the answer is "yes" because we can delete characters from t to form s. We can remove 'h' and 'g,' leaving us with "abc."
**The Approach: Greedy is the Key**
To tackle this problem efficiently, we'll adopt a greedy approach. Think of it as picking the ripest fruit from a tree. Here's the plan:
1. Initialize two pointers, one for each string: **i** for s and **j** for t.
2. Traverse both strings using these pointers.
3. Compare characters at the current positions of **i** and **j**.
4. If they match, move both pointers forward.
5. If they don't match, only move the **j** pointer.
6. Keep doing this until you reach the end of either string.
If you successfully traverse the entire s string, it means s is a subsequence of t. If the **j** pointer reaches the end of t before **i** finishes with s, then it's not a subsequence.
**Time Complexity Matters**
Our approach is efficient with a time complexity of O(m + n), where **m** is the length of s and **n** is the length of t. We traverse both strings only once, making this a linear time solution.
**Coding It Out**
Let's put theory into practice with some Python code:
pythonCopy codedef isSubsequence(s, t):
    i, j = 0, 0
    while i < len(s) and j < len(t):
        if s[i] == t[j]:
            i += 1
        j += 1
    return i == len(s)

**Conclusion: Cracked the Code**
[LeetCode 392. Is Subsequence] (https://www.nileshblog.tech/leetcode-392-is-subsequence/) ," is a problem that can be efficiently solved using a simple greedy approach. By comparing characters of both strings, we can determine whether one is a subsequence of the other. Remember, it's not about brute force; it's about being smart and efficient, just like a detective solving a case.
So, the next time you encounter this problem, don't be intimidated. You've got the code-cracking skills to answer, "[Is Subsequence] (https://www.nileshblog.tech/leetcode-392-is-subsequence/#JavaScript_leet_Code_392_Is_Subsequence)?" with confidence. Happy coding!
Discover the Power of Mojo: Your Ultimate Mojo Cheatsheet
Tags: mojo, ai
Published: 2023-09-22 17:40:42

Are you ready to supercharge your AI development skills? 🚀 Dive into the world of Mojo, the programming language that's taking the AI community by storm! In this post, we'll give you a sneak peek of what Mojo has to offer, along with some snippets from the Mojo Cheat Sheet. For the full scoop, make sure to check out the complete Mojo Cheat Sheet on my [blog](https://njoroge.tomorrow.co.ke/blog/mojo/mojo_cheat_sheet).

## Mojo REPL - Your Playground for Quick Testing:

Mojo comes with a built-in REPL (Read-Eval-Print-Loop) that allows you to quickly test your code. To start the REPL, simply type mojo in your terminal:

```bash
$ mojo
```
## Hello World - Your First Mojo Program:

Let's begin with the classic "Hello World" program in Mojo:

```python
print("Hello World!")
```
Mojo's syntax is reminiscent of Python, making it welcoming to developers of all backgrounds.

## Variables - let vs. var:

Mojo provides two ways to declare variables. Use `let` for variables that can't be reassigned and `var` for those that can be reassigned:

```python
let x = 10  # x can't be reassigned
var y = 20  # y can be reassigned
```
## Functions - Declaring and Calling:

Define functions in Mojo using the fn keyword and call them effortlessly:

```python
fn add(x: Int, y: Int) -> Int:
  return x + y

fn main():
  let x = 10
  let y = 20
  let z = add(x, y)
  print(z)  # 30
```
## Structures - Your Blueprint for Custom Types:

Mojo's structures are similar to Python classes, supporting methods, fields, and metaprogramming:

```python
struct Car:
  var mileage: Int
  var tires: Int

  fn __init__(inout self, mileage: Int, tires: Int):
    self.mileage = mileage
    self.tires = tires
```
## Integration with Python - Harnessing the Power of Both Worlds:

Mojo seamlessly integrates with Python, enabling you to import Python modules and create Python types from Mojo types:

```python
from python import Python
let np = Python.import_module("numpy")  # Import numpy from Python
let array = np.array([1, 2])
```
## Read the Full Mojo Cheat Sheet:

These snippets from the Mojo Cheat Sheet are just the tip of the iceberg! Ready to explore Mojo's full potential? Head over to my [blog](https://njoroge.tomorrow.co.ke/blog/mojo/mojo_cheat_sheet) to access the comprehensive Mojo Cheat Sheet. Whether you're a seasoned AI developer or just getting started, Mojo is a game-changer you won't want to miss!
Make Linux Mint terminal look like Ubuntu terminal
Tags: linux, ubuntu, linuxmint, gnome
Published: 2023-09-22 17:25:16

Here is how to make linux mint terminal look like GNOME terminal:

- On top left of your terminal go to **Edit → Preferences**

![default terminal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hrj87r9joo7qduzc3juv.png)

- Copy these settings:

![custom settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xzx5zimixud4sg1tbn08.png)

- Color code for the purple background: `#2C001E`

![terminal background color](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uz2i3dgpzvxq0c6l3r97.png)


- Final result:

![Ubuntu GNOME terminal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w0ueeuwtdzkx7q6bnqi1.png)
How Daily Code Deployments Improve Communication and Attention to Detail
Tags: devops, cicd
Published: 2023-09-22 17:24:48

The adoption of daily deployment strategies brings about multiple benefits that fuel the vitality of software development operations. The ability to release smaller portions of code daily eases the monitoring of errors, diminishes the risks associated with changes, and enables more rapid mitigation. When combined with Agile and DevOps practices, this tactic fosters a significant change in mindset, promoting a sense of teamwork and collective ownership.

## Shared Responsibility in Focus

The concept of shared responsibility is a cornerstone principle for effective teamwork. In a software environment, it means that everyone from developers, testers, and system engineers, to project managers and stakeholders, takes a mutual responsibility for the application's performance in production.

When everyone bears shared responsibility, there is profound awareness in decision making as each choice can impact not only the individual performing a specific task but also the whole team, the final product, and ultimately, the end-users. This shared sense of accountability motivates team members to fully invest themselves in performing tasks with the highest level of accuracy and precision.

## Amplified Communication

As every team member is closely involved in the code's lifecycle, there is a sense of mutual involvement and dependency.

This mutual obligation encourages proactive communication, fostering active discussions, idea creation, and continuous feedback. It urges team members to provide their insights, suggest enhancements, and deliberate on potential issues. This collaborative approach breaks down barriers, allowing for faster resolution of problems.

## Elevated Attention to Detail

Code being deployed every day invariably encourages a meticulous approach towards tasks, as every modification could have a considerable impact on the production environment. The introduction of daily code deployment means every commit carries potential implications for the live product. This forces team members to pay more attention to detail in the form of more thorough code reviews and unit testing.

Moreover, this heightened sense of detail encourages continuous learning and improvement. Even the smallest missteps get converted into valuable lessons, pushing the team towards refining their practices and increasing their efficiency in future deployments.

## Conclusion

Integrating daily code deployments with a culture of shared responsibility establishes a framework promoting open communication and meticulous attention to detail. This union empowers team members to make informed decisions, and be held accountable for their actions, leading to a more effective, less error-prone, and collaborative workplace.

<a href="https://dev.to/leading-edje">
  ![Smart EDJE Image](https://dev-to-uploads.s3.amazonaws.com/i/5uo60qforg9yqdpgzncq.png)
<a/>
Calling an imported API at runtime in Astro
Tags: astro, api, javascript
Published: 2023-09-22 16:58:13

---
title: Calling an imported API at runtime in Astro
published: true
description: When you want to call an API at runtime in an Astro component, you have to import it in a different spot!
tags: astro, api, javascript
cover_image: https://images.unsplash.com/photo-1565793298595-6a879b1d9492?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2071&q=80
canonical_url: https://cassidoo.co/post/imported-api-astro
---

[Astro](https://astro.build/) is a web framework that [I like for a lot of reasons](https://dev.to/cassidoo/why-i-like-astro-25na), but in particular I like that it runs as little JavaScript as possible (at runtime) by default. When I say "at runtime" I mean as the page is run in the browser, not when your site is built (I'm not going to get into the difference in this post as much, but you'll see why it matters in a sec).

Anyway, the lack of JavaScript at runtime makes for some really quick, lightweight sites that have a lot of power behind them, but sometimes you want to use some good ol' scripts.

An Astro component has some frontmatter at the top, kind of like Markdown, where you can import different components and scripts, and then a JSX-like syntax below:

```jsx
// index.astro

---
import BaseLayout from "./BaseLayout.astro";

let userName = "pretend I'm calling a function or something here";
---

<BaseLayout>
	<h1>Hello, {userName ? userName : "world"}!</h1>
</BaseLayout>

```

When you want to run a script on this page, you could import a component, or just add some `<script>` tags to handle it.

But, what if you want to import an API?

```jsx
// index.astro

---
import BaseLayout from "./BaseLayout.astro";

let userName = "pretend I'm calling a function or something here";

import api from "whatever";
---

<script>
const res = await api(); // api is not defined
</script>

<BaseLayout>
	<h1>Hello, {userName ? userName : "world"}!</h1>
</BaseLayout>

```

Unfortunately, this won't work! Because the frontmatter imports and the script is called at different points, the `api` function there is considered `undefined` when you call it.

But, have no fear, this is actually a really quick fix:

```jsx
// index.astro

---
import BaseLayout from "./BaseLayout.astro";

let userName = "pretend I'm calling a function or something here";
---

<script>
import api from "whatever";
const res = await api(); // api IS defined!
</script>

<BaseLayout>
	<h1>Hello, {userName ? userName : "world"}!</h1>
</BaseLayout>

```

You just have to import your API at the `<script>` level, and you're golden!

Did I write an entire blog post for a one-line fix? Yes.

I keep forgetting this is a thing and I figure a blog will help me actually remember this when I inevitably run into it again. Classic.

Happy trails!
My first WebDev project - My Personal Portfolio.
Tags: webdev, react, javascript, tailwindcss
Published: 2023-09-22 16:55:35

**This is my first blog.**
I have made some portfolios before which were very basic. Few of them were made only using HTML and in others I used some CSS along with HTML. I started learning **ReactJS** around a month ago and got used to **Tailwind CSS** a week ago.

I made this portfolio using ReactJS and TailwindCSS. I created various components like the first component which I created is for **navbar**.

_Code for Navbar :_
Part 1:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2ywh4woun3pjyuaeqc6g.png)
Part 2:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uikpqwtikr97khdpiiuv.png)

Second Component is for **Home page**.

_Code for Home page :_
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jb9vq5pxtmmqiaobfbfx.png)

While creating the home page I used **react-type-animation** and **react-icons** package as for the changing texts and social media icons.

Third Component was supposed to be for work but since I haven't done anything till now, I made it for **Education section**.

_Code for Education.jsx :_
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i6md3jqarzri4bp5lnzq.png)

Fourth Component is for **Projects** but since I haven't worked on any remarkable projects, I left it empty.

_Code for Projects.jsx file :_
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u174iqnafybu87bmvqn0.png)

For different Projects, I made a component and named it as **ProjectItem.jsx** for importing all the different projects in Projects.jsx file.

_Code for ProjectItem.jsx file :_ 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xz9mky69nav0snxbm8rt.png)

Fifth Component is for my **Resume** but since I haven't made one, I kept an interesting image instead of my Resume.

_Code for Resume.jsx file:_
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ki35wftbcxg8cn4g1e74.png)

Then I imported all these files into **App.jsx** file.

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

and then exported App.jsx file to **index.jsx** file.

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

Here's the link for my Portfolio :
https://praneets-portfolio.netlify.app

Any feedbacks would be helpful.
Thank You.
Use Neon.tech Postgres as a Segment Data Warehouse
Tags: postgres, neon, segment, warehouse
Published: 2023-09-22 16:50:48

**Note:** At the time I wrote this, Neon had very different pricing that allowed you to pay as you go for storage and compute, all starting at $0. They have since switched to a pricing model that does not allow you to scale storage without paying $69/mo (base price). They also have a terrible track record for uptime. I have since switched to Supabase for scalable Postgres hosting, and I recommend anybody considering Neon look at alternatives instead.

---

Segment allows users to connect a Postgres database as a data warehouse. Officially they only support Heroku, who seems to be on its way out, and AWS RedShift, which has rather complex pricing and a more limited feature set than a standard Postgres install. Unofficially, though, the service works with any standard, modern Postgres install. 

Neon is a serverless-oriented provider of hosted, managed Postgres databases that scale automatically based on usage. It's convenient, and because you don't have to commit to a storage tier and worry about complicated processes for upgrading to larger instances, it winds up priced in a compelling manner.

Connecting Segment to Neon is a mostly straightforward affair, but because Segment doesn't support SNI-based TLS on Postgres connections, Neon needs a bit of additional information to know which endpoint is being connected to. Usually it's sufficient to add this information to the connection string, but Segment insists on having all of the values broken up and fails if you modify the hostname to include a path or query string. Thankfully, Neon has a multitude of ways to specify the endpoint, including one that works with Postgres.

### Connecting to Neon PG from Segment

In the Segment interface, create a new Postgres data warehouse. Be sure to choose "Destination" connection and not the "Source" version. Choose a source as desired, and then you'll get brought to the connection details screen.

![Connection details screen](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/778kooqxv45fkwo539lq.png)

From here you'll enter most of the values copied from your Neon connection string, but when you get to the **password** field you'll need to make a change. Instead of entering the password as-is, you'll prefix it with a configuration flag specifying the endpoint, like so:

```
endpoint=<endpoint-id>;<password>
```

The endpoint ID is the first-listed (leftmost) subdomain in the hostname. For example, if your full hostname is `ep-fun-coding-94135731.us-east-2.aws.neon.tech`, the endpoint ID is `ep-fun-coding-94135731`. If your password is `abcd1234`, your final value for the password-field would be:

```
endpoint=endpoint=ep-fun-coding-94135731;abcd1234
```

Plug that in and you'll get something like this

![connection settings with credentials in place](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c1n6iugyvym02znt1nlz.png)

Click "Connect" and you should be all set!