teleren/devto huggingface dataset:
Courses courses and courses
Tags: beginners, computerscience, programming, career
Published: 2022-06-07 18:12:00



1. [HTML/CSS](https://www.freecodecamp.org/learn/2022/responsive-web-design/)

2. [MERN stack development](https://www.udemy.com/course/the-complete-web-development-bootcamp/)

3. [Introduction to Machine Learning](https://www.coursera.org/courses?query=machine%20learning%20andrew%20ng)

4. [Introduction to python](https://www.geeksforgeeks.org/python-programming-language/?ref=shm)

5. [Java](https://www.youtube.com/playlist?list=PLUcsbZa0qzu1uDiwQBjJew9mE2BxowIiu)

6. [C++/C](https://www.youtube.com/c/CodeHelpbyBabbar/playlists)

7. [OOPS](https://www.geeksforgeeks.org/object-oriented-programming-in-cpp/)

8. [Operating Systems](https://www.geeksforgeeks.org/operating-systems/)

9. [DSA](https://www.udemy.com/course/datastructurescncpp/)

10. [Interview Preparation](https://www.codingninjas.com/courses/product-based-company-course)

11. [Competitive Programming](https://www.geeksforgeeks.org/competitive-programming-a-complete-guide/?ref=shm)

12. [Web programming with python and JS](https://www.edx.org/course/cs50s-web-programming-with-python-and-javascript)

13. [JavaScript](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/)

14. [Version control](https://progate.com/courses/git)

15. [Solidity](https://cryptozombies.io/)


16. [Projects](https://www.geeksforgeeks.org/computer-science-projects/?ref=gcs)

Share the resources which you liked the most

Thanks
Maximum Swap
Tags: leetcode, dsa, theabbie
Published: 2022-06-07 18:00:43

You are given an integer `num`. You can swap two digits at most once to get the maximum valued number.

Return _the maximum valued number you can get_.

**Example 1:**

**Input:** num = 2736
**Output:** 7236
**Explanation:** Swap the number 2 and the number 7.

**Example 2:**

**Input:** num = 9973
**Output:** 9973
**Explanation:** No swap.

**Constraints:**

*   `0 <= num <= 108`

**SOLUTION:**

    class Solution:
        def maximumSwap(self, num: int) -> int:
            currmax = num
            d = list(str(num))
            n = len(d)
            for i in range(n - 1):
                j = max([(int(d[k]), k) for k in range(i + 1, n)])[1]
                if int(d[j]) > int(d[i]):
                    d[i], d[j] = d[j], d[i]
                    break
            currmax = max(currmax, int("".join(d)))
            return currmax
Distributed Load Testing on AWS
Published: 2022-06-07 17:50:05


**Background**
Using Distributed Load Testing on AWS can help you automate not just the testing for apps, to help find bottlenecks or other performance issues related to scale.   

**Use Case**
I was looking for something which could be deployed using containers. I was also interested in something that I could schedule load tests in the future. 

**Architecture**

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


**Lets Build**

_Launch in the AWS Console using CloudFormation_

[](https://console.aws.amazon.com/cloudformation/home?region=us-east-1#/stacks/new?&templateURL=https:%2F%2Fs3.amazonaws.com%2Fsolutions-reference%2Fdistributed-load-testing-on-aws%2Flatest%2Fdistributed-load-testing-on-aws.template)


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


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

I have entered my desired admin name and email address, but left everything else to use the default settings. 

Once the CloudFormation stack is created, we can select the stack, then select Outputs at the top, this will have a link to access the load testing console. 

Since this solution leverages AWS cognito, you can setup and configure additional user access there. 

Once logged in, we will see a screen like the one below. 


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

We can create a new load test, using either a single http endpoint or JMeter and uploading a file. 


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

**CloudFormation Template**

https://solutions-reference.s3.amazonaws.com/distributed-load-testing-on-aws/latest/distributed-load-testing-on-aws.template

**Additional Information**
https://aws.amazon.com/blogs/architecture/ensure-optimal-application-performance-with-distributed-load-testing-on-aws
Frontend is confusing
Tags: webdev, frontend
Published: 2022-06-07 16:30:19

### UIs are built for users

Consumers of technology understand the UIs (User Interfaces). UIs are made to be understandable for non-technology people. The [UI/UX](https://lawsofux.com/) and [HCI](https://www.educative.io/blog/intro-human-computer-interaction) fields of study are focused on lowering the barrier to entry for folks wanting to use tech. Underneath the veneer of beautiful UI is code, which 9 times out of 10 is a mess. 

#### Why is code a mess? 

Code in general is a mess. This is not an indictment on any developer but more a comment on legacy code. Code builds on itself, hacky spaghetti get approved, and tech debt accrued. It's just something that happens with time due to a variety of reasons. IMO in specific UI Code is a special kind of mess. The reason is that the Frontend ecosystem is a mess. 

### Challenges of Frontend

There are multiple entry points to the field. Professionals join the field from boot camps, universities, and back end. Each one of these disciplines teach different programming paradigms. Javascript itself doesn't enforce any particular programming patterns (OOP/Functional) and frameworks/libraries for the most part continue this pattern. It's because of this I've found quite a few Frontend code bases that don't support intuitive patterns.

Frontend is in flux. We've survived the [Browser Wars](https://thehistoryoftheweb.com/browser-wars/), [FE Framework Wars](https://akash-mihul.medium.com/front-end-framework-war-6198188f6d14) and are going through the tooling/performance wars (Remix/Next/Nest/Blitz/Redwood etc. Frameworks that are just packages of framework ecosystems). The wars continue because as a community we still haven't figured out the proper way to build frontends. Frontend pattern (routing, data passing, SSR/SPA, BFFs etc) best practice are left to be answered by a number of different libraries where it takes quite a bit of experience to understand each use case. 

#### Challenges for Junior Frontenders

In my experience, at every company I've worked at, not once have ever been able to solely focus on building frontends. That could be because of how I work or some other reason. At startups I've had to wear many technical hats and at enterprises the frontend practice was new and still required much backend work. At any size I've found a lack of understanding of the Frontend community/scope of work.

From undeliverable designs to executive off handed comments creating scope creep, the Frontend doesn't seem to be well understood. I've also found that velocity measurements of frontend workloads to be wildly variable. 

### Core Web Dev concerns for Juniors

With all that variability on the frontend, many infrastructures aren't setup for truly JAM stack applications. Servers/Lambdas still need to be provisioned for proxying into internal networks and data munging. This adds devops and backend concerns to folks who just want to push divs.
Creating a shark with a serverless function
Tags: digitalocean, serverless, functions
Published: 2022-06-07 17:43:38

There is a new [challenge from Digital Ocean](https://dev.to/digitalocean/digitalocean-functions-challenge-1f2c), it was easy to complete, I choose to create the function from the control panel and was super easy to setup with PHP and just calling the API with curl.

You can see my robot shark called Marcelo in the [aquarium](https://functionschallenge.digitalocean.com/)
How to host RAW images for free
Tags: beginners
Published: 2022-06-07 17:39:56


 
Hours ago I was searching for a way to host "raw" (with raw I mean an endpoint that returns an image) and most of them like azure blob storage are paid so I searched for free alternatives.

## GitHub
1. Create a new repo
1. Upload files
1. Drag your image
1. On the image page, right-click it and click 'copy image link'
![Example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eod9uoe14ck9pk2gx1ap.gif)


## Telegra.ph
To host the images in the telegram server
1. Go to telegra.ph
1. Click on the camera icon and choose your image 
1. Right-click the image and 'copy image link'
![Example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rhc28a56g2gy0r6x6hiv.gif)
 


You also can use the API using for example [telegram-uploader](https://www.npmjs.com/package/telegraph-uploader).
Here's a snippet of how to use it
```js
const { uploadByBuffer } = require('telegraph-uploader')
const fs = require('fs')
 
uploadByBuffer(fs.readFileSync('./image.png'), 'image/png')
  .then((result) => {
    console.log(result)
    /* {
         link: 'https://telegra.ph/file/...',
         path: '/file/...',
       } */
  })
```
## Sirv.com

It's a more advanced hosting, it provides benefits like
- Custom domain
- Folders
- Custom name
- Custom endpoint
but also as it is a professional option it have limitations for the free plan, for example it only allow you to host 500mb for free and have a bandwidth of 2GB.


Thanks for reading :)
Bit by bit guidelines to distinguish your spilling API endpoints using EthicalCheck
Published: 2022-06-07 17:38:42

The justification for this article is to show AppSec/engineers how in any case API security looking at mechanical assembly EthicalCheck and perceive your spilling APIs.

Why API spills are an ordinary issue. Most web and adaptable are security attempted at last yet APIs scarcely stick out. This infers you could have spilling APIs that are live and in progress.

Distinguishing your spilling API endpoints is incredibly direct accepting that you're using the free device. All you need is your API OpenAPI Specification/Swagger URL and get second report.

EthicalCheck - Visit the GitHub page to run your free scan: https://apisec-inc.github.io/pentest/
About me: I compose, survey, and fabricate API security apparatuses and best practices.
Add Digits
Tags: leetcode, dsa, theabbie
Published: 2022-06-07 17:30:38

Given an integer `num`, repeatedly add all its digits until the result has only one digit, and return it.

**Example 1:**

**Input:** num = 38
**Output:** 2
**Explanation:** The process is
38 --> 3 + 8 --> 11
11 --> 1 + 1 --> 2 
Since 2 has only one digit, return it.

**Example 2:**

**Input:** num = 0
**Output:** 0

**Constraints:**

*   `0 <= num <= 231 - 1`

**Follow up:** Could you do it without any loop/recursion in `O(1)` runtime?

**SOLUTION:**

    class Solution:
        def addDigits(self, num: int) -> int:
            k = num % 9
            if k == 0:
                if num == 0:
                    return 0
                return 9
            else:
                return k
Day-103 Training At Ryaz
Tags: webdev, javascript, beginners, programming
Published: 2022-06-07 17:27:18

- Date:7/06/2022
- Day:Tuesday

Today, I started at about 10:30 am as I was in progress to complete the bidding project so, firstly I started wuith the left over task so, as the data base was filled with all the tested data so, I cleaned all the data bases and done the changes in alert message that we get on clicking the read me button and also tested on various grounds that it works completely fine in all respects and also checked the validations are running fine or not so, this way my day ended up and I got to learn many new things.
Find Peak Element
Tags: leetcode, dsa, theabbie
Published: 2022-06-07 17:00:53

A peak element is an element that is strictly greater than its neighbors.

Given an integer array `nums`, find a peak element, and return its index. If the array contains multiple peaks, return the index to **any of the peaks**.

You may imagine that `nums[-1] = nums[n] = -∞`.

You must write an algorithm that runs in `O(log n)` time.

**Example 1:**

**Input:** nums = \[1,2,3,1\]
**Output:** 2
**Explanation:** 3 is a peak element and your function should return the index number 2.

**Example 2:**

**Input:** nums = \[1,2,1,3,5,6,4\]
**Output:** 5
**Explanation:** Your function can return either index number 1 where the peak element is 2, or index number 5 where the peak element is 6.

**Constraints:**

*   `1 <= nums.length <= 1000`
*   `-231 <= nums[i] <= 231 - 1`
*   `nums[i] != nums[i + 1]` for all valid `i`.

**SOLUTION:**

    class Solution:
        def findPeakElement(self, nums: List[int]) -> int:
            n = len(nums)
            for i in range(n):
                left = nums[i] > nums[i - 1] if i > 0 else True
                right = nums[i] > nums[i + 1] if i < n - 1 else True
                if left and right:
                    return i
Is it a good idea to build backend with nextJS?
Tags: nextjs, node, discuss, javascript
Published: 2022-06-07 16:56:24

Hi,
I'm planning to build a full stack application. I have plan to scale the application and make it a really big project over time. Before I start working on my project, I just wanted to know if it's a good idea to build the backend of my project with NextJS API or should I use a node-express backend server separately.
I will use nextJS as the front end and that's why I'm asking this question.
Thanks for your help in advance.
🔗PythonMysql_Connection
Tags: beginners, python, mysql
Published: 2022-06-07 16:55:31

# MysqlPythonConnection</h3>


### About The Project
MySQL Connector Python is used to access MySQL databases from Python using this repo. 
Student databases will be utilized in this project.

### Features

main.py program will be able to
1. Insert Book
2. Insert Student
3. Insert Borrowing

Step 1 : Run studentDb.sql file in command prompt.
[studentDb.sql](https://github.com/Prajwal056/MysqlPythonConnection)
- How to Run MySQL 
  ```sh
  mysql -u root -p
  ```
	 	 
- Give the path of .sql file as:
  ```sh
  mysql> source <sql Path.sql>
  ```	
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/39gyjkkjy5nsbsrp8j43.jpg)
Step 2: Run main.py file
main.py
 ```sh
from secrets import choice
from tkinter import W
import mysql.connector as c # import the mysql connector
con = c.connect(host="localhost", user="root", password="root", database="studentdatabase") # connect to the database

print('*'*50)
print("Welcome to the Student Database")
print('*'*50)

cursor = con.cursor() # create a cursor
while True:
    choice= int(input("1-> Insert Book\n2-> Insert Student\n3-> insert Borrowing\n4-> Exit\n Your Choice: "))
    if choice == 1:
        book_name = input("Enter the book name: ")
        author = input("Enter the author name: ")
        isbn = input("Enter the isbn number: ")
        query = "INSERT INTO books (book_name, author_name, isbn_number) VALUES (%s, %s, %s)"
        values = (book_name, author, isbn)
        cursor = con.cursor()
        cursor.execute(query, values)
        con.commit()
        print("Book inserted successfully")
    elif choice == 2:
        name = input("Enter the name: ")
        roll = input("Enter the roll number: ")
        query = "INSERT INTO students (student_name, roll_number) VALUES (%s, %s)"
        values = (name, roll)
        cursor = con.cursor()
        cursor.execute(query, values)
        con.commit()
        print("Student inserted successfully")
    elif choice == 3:
        roll = input("Enter the roll number: ")
        book_name = input("Enter the book name: ")
        query = "INSERT INTO borrowings (roll_number, book_name) VALUES (%s, %s)"
        values = (roll, book_name)
        cursor = con.cursor()
        cursor.execute(query, values)
        con.commit()
        print("Borrowing inserted successfully")
    elif choice == 4:
        break
    else:
        print("Invalid choice") 
cursor.close()
con.close()
print("Connection closed")
 ```
Chain Stars 2
Published: 2022-06-07 16:55:10

Creating Static HTML and CSS

Using react started by creating and setting up static HTML with similar data that would be replace with data from the API. I only started with the primary core of the app, which included App, Landing, BicycleDetail, AddBicycle, and EditBicycle.  All of the pages that applied to user were put on the back burner since despite the previous planning I wasn't entirely sure how I wanted those aspects to work. Further, by adding in basic navigation I was able to get a feel for the flow of the page. The time it took me to layout the static HTML and CSS enabled me to set the bases for the overall visual ascetic and validate that my ERD by laying out where data would be needed and making sure there were no omissions.  

Main<App>
The App has probably changed the most since the inception of the app, and despite being functional finished I made a small UI change to the header today after some feedback. The header needs to house three items depending on the state of isLoggedIn.  (I will a post just on the ternaries used on the APP page) 1. Main link to return user to the main page from anywhere in the app. 2. Needs to have a linked to signin/signout for the user. 3. A place to signup and if the user is signed in a linked to the users page. The footer was set to be of little use to the user but instead have links to my personnel website and github.  If this wasn't my capstone I would have populated the area with more use relevant material such as a away to contact website admin or some type of user assistance.  

The results and learning 
I started with the app in mobile mode.  That was I would be able to make the navigation and layout for a smaller screen first.  This led to minor tweaks to the UI which include changing what items were linked as well as moving the positioning of those links to make sure they are more naturally accessible on smaller screen. As the app developed I made the layout and design responsive to bigger screens.  Putting in this time gave me a more robust foundation that saved a great deal of time during the apps development. 
 
 Next article creating the migrations and controllers.
Stunning Presentations with Asciidoctor and RevealJS
Tags: tools, asciidoctor, presentations, revealjs
Published: 2022-06-07 16:51:58

In the [previous post][1], we quickly saw the power of [Asciidoctor][2], how it could enhance the documentation, writing and many other features.

One of the other great features is its ability to create stunning HTML presentations along with another utility called [RevealJS][3]

Below is the sample presentation that is an asciidoctor markup file. 

```
= Stunning Presentations
Prabhu R
:imagesdir: images
:title-slide-background-image: sea.jpg
:title-slide-transition: fade
:title-slide-transition-speed: fast
:experimental: true

== A Great Story

image::galaxy.jpg[background, size='cover']
Press kbd:[s] for Speaker View that displays notes  

[.notes]
--
* tell anecdote
* make a point
--

[transition='convex']
== Transition Convex

This slide has a `convex` effect

[background-color="gray"]
[transition='zoom']
== Transition Zoom

This slide has a `zoom` effect,

[background-color="teal"]
[transition='zoom']
== Vertical Slides

This is a Vertical slide,  click kbd:[&#x2193;] to see vertical slides

[background-color="crimson"]
[transition='slide']
=== Vertical Slide 1

Vertical slide 1

[background-color="brown"]
[transition='slide']
=== Vertical Slide 2

Vertical slide 2

[background-video="orca.mp4",options="loop,muted"]
[transition='concave']
== Background Video

Background looping video

[%notitle]
[transition='concave']
== THE END

image::end.jpg[background, size=cover]
```

To see how this stunning it gets rendered, visit [here][4]

Pressing <kbd>Esc</kbd> shows the thumbnail view of all the slides. Clicking on any of the slides jumps to that slide 

The complete source is available in [GitHub][5], and can be used as a starter template for your presentations

With a little of CSS knowledge more amazing effects can be brought it to the presentations. For more details look at the [asciidoctor-revealjs site][6]

[Benjamin Schmid][7] has an even more amazing presentation, a nice example of what asciidoctor and revealjs combination could produce.

[1]: https://blog.teamnexus.in/blog/2022/06/03/asciidoctor-a-writers-swiss-army-knife/ "AsciiDoctor - A Writer's Swiss Army Knife"
[2]: https://asciidoctor.org "Asciidoctor"
[3]: https://revealjs.com/ "RevealJS"
[4]: https://rprabhu.github.io/stunning-presentations/presentation.html "Stunning Presentation"
[5]: https://github.com/rprabhu/stunning-presentations "Presentation Source"
[6]: https://docs.asciidoctor.org/reveal.js-converter/latest/ "Asciidoctor RevealJS documentation"
[7]: https://bentolor.github.io/java9to13/#/ "Power Catchup"
Environment Variables in Heroku - Python
Tags: python, heroku, webdev, productivity
Published: 2022-06-07 16:51:53

So I was messing around with Heroku trying to find out how to add environment variables without using the CLI (so setting the variables on the website), and after an hour I figured out how to do it.
Now I want to spread my knowledge so anybody else who wants to know how to set and access environment variables in Heroku using Python can do it easily.

So first go to https://dashboard.heroku.com/apps so you can see all the apps you have deployed.
It should look a bit like this:

![dashboard](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ogndsiyf2qeysmwx3j1g.png)

Now click on the app you want to set the environment variables on.
It should show something like this:

![navbar](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r2k9m2ki26xjp17aoufd.png)

Then click on settings (which is on the right hand side of the navbar).
That should lead you to a page that looks like this:

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

Then click the button that shows `Reveal Config Vars`.
It should display something a page like this:

![config](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a2g0bfi4wb5l62py28l4.png)

In the `KEY` input, enter the name of the environment variable, and in the `VALUE` input, enter the value of the environment variable.

You are done with the website side of the problem!

---

Now go to your code.
To access your environment variables which you stored in Heroku in Python, you only need to install the `os` module.
```py
import os
```

Then, the function to access to the environment variables is `os.getenv("[key_name]")` (replacing [key_name] with the key name).

For example, if you want to access the environment variable with the key name of `Password`, you would do:
```py
import os
passwordvalue = os.getenv("Password")
```

---

You've done it!
Now you can easily access environment variables in Heroku in Python.