teleren/devto huggingface dataset:
MY JOURNEY INTO TECH
Published: 2022-09-26 13:44:33

Like most journeys i’ve embarked on, my journey into tech has been adventurous, i must also add that it has sometimes been laborious. Although still very much in it’s infancy, i feel like i’ve been on this journey for a lifetime.
It all started around mid-july in the year 2021 when i decided to do something about the desire in me at that time to be amongst those referred to as ‘programmers’. A programmer is a person who writes programs- set of instructions that a computer follows. I thought to myself,’ok,just learn a programming language and your desire will be met’. Javscript was the programming language i opted for but i was advised to learn HTML and CSS first.
So i got myself a personal teacher who taught me HTML, CSS and javascript - ‘the holy trinity’ as referred to some web developers. Learning HTML and CSS is fun and it even gets better when you have a good teacher. I had a very good teacher who seamlessly made me really good at the afformentioned. We dwelled on HTML and CSS for about a month before heading into the last phase/part of the ‘trinity’,javascript.
It must said that i struggled a little bit to get the hang of the language. I had many instances where i’d put on a frown at classes because i just seemed, at that time , to not understand even the basics. Weeks passed and i noticed improvements after continuous practice. I began to get better and with time i was au fait with the language. I stopped attending classes around late October 2021 and for the rest the year 2021 i worked on what i was taught.
My original plan was just to be amongst those referred to as ‘programmers’ as i thought it sounded cool but a paradigm shift occurred in my thought process when i saw solutions to very critical
real-life problems that were developed using tech. Being a solution minded person myself, i decided that i will not be a programmer because it sounded cool but to be able to solve real-life problems within my space.
After experiencing many stops and starts in my tech journey from the beginning of the year 2022 till about June, i got the journey back on track in July after I gained admission into Codelab – an institution where as at the time of writing this, am undergoing training to become a full-stack software engineer.
CodeLab is slowly but surely making the path to being able to proffer solutions to real-life problems through tech clearer by the day. I know i have a long way to go but i’m willing and with CodeLab ever present to guide me i know that i will be able to solve real-life problems too.
Cockpit linux
Tags: cockpit, centos, linux
Published: 2022-09-26 13:12:48

**Cockpit meaning**

Cockpit is a free, open source server administration tool that allows us to easily monitor and manage one or more Gnu/Linux servers via a web browser.

**Simple to use**

Cockpit makes Linux discoverable. You don’t have to remember commands at a command-line.

See your server in a web browser and perform system tasks with a mouse. It’s easy to start containers, administer storage, configure networks, and inspect logs. Basically, you can think of Cockpit like a graphical “desktop interface”, but for individual servers.

**Using Cockpit**

Here’s a subset of tasks you can perform on each host running Cockpit:

- Inspect and change network settings

- Configure a firewall

- Manage storage (including RAID and LUKS partitions)

- Create and manage virtual machines

- Download and run containers

- Browse and search system logs

- Inspect a system’s hardware

- Upgrade software

- Keep tabs on performance

- Manage user accounts

- Inspect and interact with systemd-based services

- Use a terminal on a remote server in your local web browser

- Switch between multiple Cockpit servers

- Extend Cockpit’s functionality by installing a growing list of apps and add-ons

- Write your own custom modules to make Cockpit do anything you want

Also troubleshoot and fix pesky problems with ease:

- Diagnose network issues

- Spot and react to misbehaving virtual machines

- Examine SELinux logs and fix common violations in a click

- Inspect detailed metrics that correlate CPU load, memory usage, network 

More features appear in Cockpit every release.

**CentOS**
Cockpit is included in CentOS 7.x:

- Install cockpit:

```
sudo yum install cockpit
```

- Enable cockpit:

```
sudo systemctl enable --now cockpit.socket
```

- Open the firewall if necessary:

```
sudo firewall-cmd --permanent --zone=public --add-service=cockpit
sudo firewall-cmd --reload
```


**Get started**

After installing and enabling Cockpit, visit port 9090 on your server (for example: https://localhost:9090/ in a browser on the same machine as Cockpit).

**THAT'S ALL FROM ME, THANKS**
Web workers cheatsheet & 4 other webdev tips you may want to know 🚀
Tags: javascript, css, html, webdev
Published: 2022-09-26 13:30:03

## 1. Web workers cheatsheet


A worker thread can perform tasks without interfering with the user interface. This can be handy if you want to perform a CPU heavy operation for example:


![Web workers cheatsheet](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gx62o97gqnlzdogaeq2r.png)




&nbsp;
## 2. Manipulating placeholders with CSS

📍How to style a placeholder?  Use the `::placeholder` pseudo element

📍How to target an input with a visible placeholder?  Use the `:placeholder` pseudo class 



![Manipulating placeholders with CSS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a0js9t38egoyz7a77f25.png)


&nbsp;
## 3. Make your headers look better

You can use the `text-rendering` CSS property to provides information to the rendering engine about what to optimize for when rendering text:


![Make your headers look better](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/suje0upqdi5f4g6r9ti6.png)





&nbsp;

---

Hi there! I'm Mustapha, a technical writer, speaker and a passionate JS / TS developer. Follow me on [Twitter](https://twitter.com/TheAngularGuy) for daily tech tips 🚀


---





&nbsp;
## 4. Sass mixins cheatsheet

You can use Mixins to define styles that can be re-used throughout your stylesheets:


![Sass mixins](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4q56n44j929aa70944n3.png)



&nbsp;
## 5. Text alignement with HTML

You can use `<sup>` HTML element to display a superscripts: a raised baseline using smaller text, and `<sub>` to render a subscripts: a lowered baseline and smaller text:



![Text alignement with HTML](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ydozwlt8lqtzwddi8dru.png)



You can achieve the same behaviour with the `vertical-align` CSS property. More on this below:

{% embed https://dev.to/mustapha/7-amazing-css-properties-you-may-not-know-yet-eej %}









&nbsp;
&nbsp;

### Let's connect

That's it for this week. I hope you liked it. If you did, please share it with your friends & colleagues and follow me on Twitter [@theAngularGuy](https://twitter.com/TheAngularGuy) where I tweet about web development and computer science 🚀

Cheers!
E2E Testing with Cypress and Typescript
Tags: cypress, typescript, e2e, formio
Published: 2022-09-26 13:24:42

This post will show you how to install and configure Cypress with Typescript to test simple Form.io forms.

 I used [formio angular demo application](https://formio.github.io/angular-demo/#/) to perform e2e test against. Here is the testing project [github-repo](https://github.com/aktibaba/cypress-ts-framework).

After creating a project folder and navigating project root directory, as a first step, we need to install Cypress with this command:
- `npm install cypress --save-dev` 
then  we need to install typescript with this command :

- `npm install --save-dev typescript`

After installing Cypress, we need to start Cypress in open mode with `npx cypress open ` to configure it. Starting Cypress will create cypress.config file and other folders.  Inside Cypress folder 
we need top add tsconfig.json file like below

![tsconfig](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7xbmgnpthr05yskq7vjo.png)


```
{
  "compilerOptions": {
    "target": "es5",
    "lib": ["es5", "dom"],
    "types": ["cypress", "node"]
  },
  "include": ["**/*.ts"]
}

```

After that we can change all js file to ts file and ad our first testing file to run 

  command to run test in headless mode:
- npx cypress run 

 command to run test in open mode:
- npx cypress open
What Projects Are You Contributing to During Hacktoberfest?
Tags: programming, opensource, discuss, webdev
Published: 2022-09-26 13:12:03

Hacktoberfest starts next week! Many developers look forward to this event to contribute to their favorite projects and earn some cool swag.

What repositories or open source projects are you planning to contribute to during Hacktoberfest?

P.S: Participate in Medusa's Hackathon and win up to $1,500 and some Medusa swag! Learn more in [this post](https://dev.to/medusajs/medusa-hackathon-sign-up-win-merch-and-prizes-up-to-1500-during-hacktoberfest-4h45).
Module parse failed: Unexpected token error in ReactJS
Tags: react
Published: 2022-09-26 13:20:52

I have below code in my `StatusEditAdmission.jsx` file.

https://controlc.com/f800d4e7

I am getting `Module parse failed: Unexpected token (100:29)
You may need an appropriate loader to handle this file type.` error.

https://i.stack.imgur.com/8KRkr.png
[DOCKER] [NODE]: How to rebuild node_modules only when it's necessary!
Tags: javascript, typescript, node, docker
Published: 2022-09-26 13:15:59

## Introduction:

Not everytime we change our code it means that we have implemented *new dependencies*: if we have not inserted a new package into our project, **there's no reason at all to rebuild `node_modules` folder**.

So let's understand how we can upgrade our **efficiency**, as your **development and debugging time** for Node applications running Docker will be significantly reduced.

## How Node Dockerfiles are usually implemented:

Let's take a fast look at this usually seen `Dockerfile`, which is **bad** implemented.
 
```
FROM node:16

# Create app directory
WORKDIR /usr/src/app

# Copy source
COPY . .

# Install dependencies
RUN npm install

# Run server
EXPOSE 8080
CMD [ "node", "server.js" ]
```
The whole efficiency problem here is located at `COPY . .`

This is **bad**. Doing so will result in: everytime we make a change to a file in `.`, our modules folder will have to be built again and again and again...

## Fixing it:

Instead, we should **firstly** *only* copy our `package.json` and `package-lock.json` files (which controls our dependencies) to our working directory and then install  them.

So, **let's update our Dockerfile** to:

```
# Copy package.json and package-lock.json
COPY package*.json ./

# Install dependencies
RUN npm install
```

And only then, we can copy the rest of our files:

```
COPY . .
```

So, our **fixed Dockerfile** version will be:

```
FROM node:16

# Create app directory
WORKDIR /usr/src/app

# Copy package.json and package-lock.json
COPY package*.json ./

# Install dependencies
RUN npm install

# Copy source
COPY . .

# Run server
EXPOSE 8080
CMD [ "node", "server.js" ]
```

## Explanation:

It's all about Docker **cached layers**.

Each Docker image consists of a series of layers.

Commands in your `Dockerfile` will always generate new layers.

Instead of keeping everything within only one layer, we should break it on different parts.

Because **Docker will try to use an existent cached layer on rebuild**.

That's the simple explanation.
You can read the details on [official documentation](https://docs.docker.com/storage/storagedriver/).

## Conclusion:

Now, everytime `package.json` file changes, `npm install` will be runned again. Otherwise, it will be simply skipped.

You can check this behavior on your log: just look for ` ---> Using cache `, which indicates `node_modules` is not being rebuilded.

# Liked this post? ;D

If you do, please consider following me or favoriting this post!
Case insensitive input for search in Bubble app development
Tags: nocode, tutorial, guides, beginners
Published: 2022-09-26 13:11:01

The Bubble has secured one of the finest names when it comes to no-code development. However, from time to time users face certain blockers, and to address such issues we've begun this series of short articles called 'Solutions for Bubble'.

One such issue is the inability to run a case-insensitive database search during bubble development which was also one of the many topics that popped up in the Bubble Forum.

### Let's dig deeper into the problem statement

When you want to search for a value using “Do a search for” the filters you set are always case sensitive. Because of this, it cannot find all possible values that share the same characters.

**Scenario:**

Suppose a user has a Data Type that has a Company Name field. If Microsoft already exists in an entry, then the user would want to disallow anyone from adding duplicate records with the same Company Name.

It is therefore imperative that all variations of the case that a user types into an input field ("microsoft", "MICROSOFT", "MicRosoft") match the value already in the database ("Microsoft").

### But how will the user do that? Let's look at the solutions

Leveraging [Instant Text plugin](https://bubble.io/plugin/instant-text-1527871417291x467091680897007600)  ⚡

Instead of waiting for a delay in the standard input, the Instant Text plugin offers immediate feedback to the users and updates the value on the state in real time.

We know storing data in multiple places can put you off but here it really is the easiest way. ⏩

### How does it work? 🤔

This solution stores the value in two fields, one for the original display and one that is always lowercase.


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

### But, I don't want to store two values!

If you really don’t want to store two values, you could do the lowercase comparison in an advanced - ':filter operation'. But that would require downloading all of your usernames to the client, which could be problematic.

Note - you can’t do lowercase (or uppercase) comparisons using a search constraint, but you can do it in an advanced :filtered operation. If you want to go that route, we have an upcoming post coming on the same.

Hope this helped. 🔓

[Here's the link to the forum thread ](https://forum.bubble.io/t/why-oh-why-am-i-unable-to-search-the-db-case-insensitive/57477/7)
Build a Tv app
Tags: reactnative, android, ios, tv
Published: 2022-09-26 12:56:49

Using react native.
1. create a project with `npx react-native init AppName`
2. add tv support package for react native with `npm i react-native@npm:react-native-tvos`
From this point, your app is ready to go.
Bonus is to use the following library to easily manage navigation and focus. [Norigin-Spatial-Navigation](https://github.com/NoriginMedia/Norigin-Spatial-Navigation)
Back To The Basics
Published: 2022-09-26 12:52:01

---
title: Back To The Basics
published: true
description: 
tags: 
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3agvwdw38xww4zedzi5j.png
canonical_url: 'https://kevwe.com/weekly/202239'
# Use a ratio of 100:42 for best results.
---
DNS lays at the core of the internet, too often we take it for granted.

While it's able to bring marvels, it's also a dangerous technology.


As always, knowing and understanding is better than passive acceptance.


The zen of simple tools is king:


https://kevwe.com/weekly/202239
Redis-OM Lambda CDK
Tags: redishackathon
Published: 2022-08-29 07:57:18

### Overview of My Submission

This sample shows how to define a Lambda function which uses [Redis-om](https://github.com/redis/redis-om-node) via AWS Cloud Development Kit. This is a fork of [prisma-lambda-cdk](https://github.com/aws-samples/prisma-lambda-cdk/) sample repo which replaces mysql/postgres with redis stack & prisma with Redis-om.

By this sample, you can see how a Lambda function which uses Redis OM can be deployed with CDK, how indexes can be created from Lambda, and how Redis OM works in Lambda.


### Submission Category: 
Minimalism Magicians

### Language Used
Typescript


### Link to Code
{% embed https://github.com/jaanchal1/redis-om-lambda-cdk %}

### Additional Resources / Info

#### Performance Benchmarks
I did the testing for both lambda functions by creating a url for them and then using [k6](https://k6.io/) to test them.
Terminology:

- VU Count: Number of concurrent requests being made
- Duration: The duration for which test was run
- Function type: Type of Lambda function executed
- Prisma p95: p95 response time of prisma lambda function
- Redis OM p95: p95 response time of redis om lambda function
- Prisma p90: p90 response time of prisma lambda function
- Redis OM 90: p90 response time of redis om lambda function
- Prisma AVG: Avg response time of prisma lambda function
- Redis OM AVG: Avg response time of redis om lambda function

| VU Count | Duration | Function Type           | Prisma p95 | Redis OM P95 | Prisma p90 | Redis OM p90 | Prisma AVG | Redis OM AVG | Prisma Failed Reqs | Redis OM Failed Reqs |
| -------- | -------- | ----------------------- | ---------- | ------------ | ---------- | ------------ | ---------- | ------------ | ------------------ | -------------------- |
| 10       | 30s      | Handler - Create Data   | 91.99 ms   | 67.56 ms     | 74.57 ms   | 60.4 ms      | 71.56 ms   | 57.16 ms     | 0                  | 0                    |
| 20       | 30s      | Handler - Create Data   | 89.35ms    | 65.7ms       | 74ms       | 59.19ms      | 70.56ms    | 54.73ms      | 26.60%             | 24.66%               |
| 20       | 30s      | Handler - Retrieve Data | 698.56ms   | 516.26ms     | 600.07ms   | 394.06ms     | 547.38ms   | 344.9ms      | 0                  | 0                    |
| 20       | 30s      | Migration Runner        | 10.87s     | 3.16s        | 8.95s      | 2.93s        | 7.8s       | 2.67s        | 0                  | 0                    |

From these stats we can infer that there's a signifact performance boost when migrating schemas using Redis OM instead of Prisma.
Reads from Redis are also faster than Mysql & while not much but writes are faster as well.


- - - 

* _Check out [Redis OM](https://redis.io/docs/stack/get-started/clients/#high-level-client-libraries), client libraries for working with Redis as a multi-model database._
* _Use [RedisInsight](https://redis.info/redisinsight) to visualize your data in Redis._
* _Sign up for a [free Redis database](https://redis.info/try-free-dev-to)._
Trying to fix football score from list in php
Tags: webdev, php, beginners
Published: 2022-09-26 12:39:59

The number of goals achieved by two football teams in matches in a league is given in the form of two lists. For each match of team B, compute the total number of matches of team A where team A has scored less than or equal to the number of goals team B has scored in a match

Example 
TeamA = [1,2,3]&nbsp;&nbsp;&nbsp;
Team B = [2,4]
team A has played 3 matches and has scored TeamA = [1,2,3] goals in each match respectively. Team B has played two matches and has scored teamB = [2,4] in each match respectively. For two goals scored by teamB in its first match team A has two matches with 1 and 2 score. For four goals scored by teamB in its second match team A has three matches with 1, 2 and 3 score.
Hence the answer is [2,3]
the main editing should be done only in the function please.
how do I go about it.

```
<?php

function counts($teamA, $teamB) {
    

}
$fptr = fopen(getenv("OUTPUT_PATH"), "w");

$teamA_count = intval(trim(fgets(STDIN)));

$teamA = array();

for ($i = 0; $i < $teamA_count; $i++) {
    $teamA_item = intval(trim(fgets(STDIN)));
    $teamA[] = $teamA_item;
}

$teamB_count = intval(trim(fgets(STDIN)));

$teamB = array();

for ($i = 0; $i < $teamB_count; $i++) {
    $teamB_item = intval(trim(fgets(STDIN)));
    $teamB[] = $teamB_item;
}

$result = counts($teamA, $teamB);

fwrite($fptr, implode("\n", $result) . "\n");

fclose($fptr);
```

If anything is needed let me know
20+ Killer Websites for Web Developers
Published: 2022-09-26 12:35:29

<h2 style="background-color: white; box-sizing: border-box; color: #333333; font-family: &quot;Open Sans&quot;, Helvetica, sans-serif; font-size: 15px; line-height: 26px; margin: 0px;">There are so many websites to make the work of developers easier. Everyone doesn’t know all. In this article, we will see 20+ Must-Visit Killer Websites For Developers.&nbsp;</h2><div><br /></div><div>I&nbsp;<span face="&quot;Open Sans&quot;, Helvetica, sans-serif" style="background-color: white; color: #333333; font-size: 15px; font-variant-ligatures: no-common-ligatures;">would like to share with you some useful websites, some of which can improve your productivity, some can help you write articles, and some can help you with design. Let’s take a look now.&nbsp;</span></div><div><span face="&quot;Open Sans&quot;, Helvetica, sans-serif" style="background-color: white; color: #333333; font-size: 15px; font-variant-ligatures: no-common-ligatures;"><br /></span></div><div><span face="&quot;Open Sans&quot;, Helvetica, sans-serif" style="background-color: white; color: #333333; font-size: 15px; font-variant-ligatures: no-common-ligatures;">Read More:&nbsp;</span></div><h1 class="title" style="background-color: white; box-sizing: border-box; color: #333333; font-family: Roboto, Helvetica, sans-serif; font-size: 26px; line-height: 34px; margin: 10px 0px 0px;"><a href="https://www.codelivly.com/killer-websites-for-web-developers" target="_blank">20+ Killer Websites for Web Developers</a></h1>
The Hacker’s Tribute Vol. 95 – Once Upon a Time in Hacker’s Land
Published: 2022-09-26 12:25:49

We have a passion for cutting-edge **technology** and **software development.**


To satisfy the appetite of our readers, we welcome a dish of an **AI-driven language database** that can detect diseases, mixed with a sharp taste of **Scala** dependencies and topped with a drink from an **anti-hacking course**.  


What’s more on the **menu**? We are astonished that the **floppy** disc industry is still thriving in one place. 


Our Editor-in-Chief, **Dan "the Man" Kowalski**, has recently made some curious discoveries. Check it out for yourself: [The Hacker's Tribute Vol. 95 - Once Upon a Time in Hacker's Land.  ](https://softwarehut.com/blog/tech/the-hackers-tribute-vol-95)