teleren/devto huggingface dataset:
GitHub Externship ❤️ Hoppscotch
Tags: github, opensource, contributorswanted
Published: 2021-04-22 16:46:22

# **[Join GitHub Externship @ Hoppscotch](https://github.com/hoppscotch/hoppscotch/blob/main/GITHUB_EXTERNSHIP.md)**

---

<mark>India 🇮🇳 is home to one of the largest communities of student developers in the world.</mark> In 2020 we saw the number of students participating in the GitHub Campus program increase by 142 percent, over 100,000 students signed up to GitHub Student Developer Pack, and campus offering was adopted by more than 100 higher-education institutions in India.

This growth is great to see, as the student ecosystem is incredibly important to the continued growth and pace of innovation in India.  However, students do not have enough opportunities to get mentorship that can make them real-world-ready and enhance their job prospects. 

### We are super excited to be a ‘Partner Organization’ of [GitHub Externship](https://github-externships.github.io/externship/) and look forward to supporting all interested students to participate and contribute to our [open-source projects](https://github.com/hoppscotch).

&nbsp;

{% cta https://github.com/hoppscotch/hoppscotch %} GitHub → {% endcta %} {% cta https://hoppscotch.io/ %} Web app → {% endcta %}

---

> To support the growing community of student developers and to address their needs, GitHub is launching **GitHub Externships**. This builds on **[GitHub Campus](https://education.github.com/schools)** offering by providing students a unique opportunity to engage with companies in India, via fellowship programs, and build the right skills future developers need, to succeed in an enterprise environment. The program really connects the dots between open source, the next generation of software developers, and successful companies.

> The GitHub Externship is a 90 days fellowship program about learning, preparing students to be market-ready, strengthening industry-academia relations, and giving practical experience to students. This also aims to provide innovative solutions to the partner organizations on their existing challenges, organizations could potentially identify real talent that can be employed by the organizations at later stages.

---

# Eligibility

Third-year students that are part of higher-education institutions in India have signed up for the GitHub Campus Program.

For more details please go to the [program page here](https://github-externships.github.io/externship).

## Need Help?

If you have any questions or queries please contact us via [Telegram](https://t.me/hoppscotch_externship), [Discord](https://discord.gg/GAMWxmR) or send an email to us at support@hoppscotch.io.

[Join GitHub Externship @ Hoppscotch](https://github.com/hoppscotch/hoppscotch/blob/main/GITHUB_EXTERNSHIP.md)
Testing Unity WebGL Build On Your PC Before Uploading
Tags: gamedev, unity3d
Published: 2021-04-22 16:38:02

You have finished your game.

You're building your WebGL game.

You can’t test it on your PC but that's okay, you can just upload it to itch.io or to simmer.io and give the links to all my friends.

You upload your build and when you least expect a HUGE BUG appears that you have no idea it was there.

How can we avoid this?  Simple, test your WebGL on your PC.

By default even if you select your index html file from the build folder you will get the following errors 👇regardless of the web browser you choose:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ye2tdyhr7soojnzmqed.png)

By nature WebGL can only run on a hosting server like itch.io or simmer.io and to run your WebGL game we must tell our PC to act like a server.

But how? Using Xampp

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/omruepq8xrlu9bdsdmjz.jpg)

Xampp is a web developer tool, in small words, that tells your PC to act like a hosting server to run web applications locally instead of testing everything from a paid services hosting; using this allows web developers to test applications before uploading, we can do the same with our WebGL game.

To start you must install Xampp:

Download application:
https://www.apachefriends.org/download.html

If you need help installing Xampp, follow this guide:
https://www.wikihow.com/Install-XAMPP-for-Windows

Once you have everything set up you must locate the folder that Xampp create called “htdocs”, in there you will put / place your WebGL build folder:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lebko3vxvlp1s7dqvr7s.png)

Before testing your game you must activate Xampp and turn on Apache server:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lbtspf05trnchf36r6gx.png)

Once you have everything running using the web browser of your choice you will put the following on the search bar:

localhost/{name of the WebGL folder build}
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ywmwabzd291i6z57mr9k.jpg)

And with that you can play your WebGL game and test it before uploading.

Hope this helps.

TO BE CONTINUED 😎
Total number of comparision and swaps in bubble sort
Tags: cpp, python, ruby, ds
Published: 2021-04-22 16:36:55

In `c++`
```c++
#include <iostream>
using namespace std;
int main()
{
	int temp=0;
	int swap=0,comp=0;
	int a[3];
	cout<<"Enter 3 numbers"<<endl;
	for (int i = 0; i < 3; ++i)
	{
		cin>>a[i];
	}

	cout<<endl;
	cout<<"The list you enterd"<<endl;
	for (int i = 0; i < 3; ++i)
	{
		cout<<a[i]<<" ";
	}
	cout<<endl;
	for (int i = 1; i < 3; ++i)
	{
		for (int j = 0; j < 3-i; j++)
		{
			if(a[j]>a[j+1])
			{
				temp=a[j];
				a[j]=a[j+1];
				a[j+1]=temp;
				swap++;
			}
			comp++;
		}
	}
	cout<<endl;
	cout<<"The sorted list"<<endl;
	for (int i = 0; i < 3; ++i)
	{
		/* code */
		cout<<a[i]<<" ";
	}
	cout<<endl;
	cout<<"The number of swaps "<<swap<<endl;
	cout<<"The number of comparision "<<comp<<endl;

}
```
in `python`
```python
a=[5,61,1]
swap=0
comp=0
leng=len(a)

for i in range(1,leng):
	for j in range(0,leng-i):
		if a[j]>a[j+1]:
			temp=a[j]
			a[j]=a[j+1]
			a[j+1]=temp
			swap+=1
		comp+=1
print("The sorted list")
for i in a:
	print(i,end=" ")
print()
print("Total number of comparison {}".format(comp))
print("Total number of swap %d"%swap)
```
in `ruby`
```ruby
a=[5,61,1]
comp=0
swap=0
for i in (1...a.size)
	for j in (0...a.size-i)
		if a[j]>a[j+1]
			temp=a[j]
			a[j]=a[j+1]
			a[j+1]=temp
			swap+=1
		end
		comp+=1
	end
end
puts 
puts "The sorted list"
a.each_index do |num|
	print " #{a[num]}"
end
puts
puts " Total number of comparision #{comp}" 
puts " Total number of swaps #{swap}" 
```
Linq - How to write your own version of Sum extension
Tags: dotnet, csharp, linq, delegate
Published: 2021-04-22 16:35:47

# Sum Extension

I am sure those who know about **Linq**, must have used Sum extension method in their logic, in some way.

A basic example showing the use of Sum extension method.

Ex. Sum up the salary of employees in a generic list
{% gist https://gist.github.com/debashish2014/68b55e74172735bcb2d12219a06efb4b %}

And, why we wouldn't use it. It is powerful & simple to use.

But, have you ever wondered how to mimic the same functionality in your own extension method??

Sounds Interesting, Right !!

Let's get ready for the challenge !!

Let's see how....

I would be creating an extension method named **SumEx**. The signature would be same, so this version will be totally compatible with the previous example. We will see it in action.

This extension is a perfect example of how to make delegates into work, in a real world use case.

{% gist https://gist.github.com/debashish2014/9deaa18d3c897d39bf45a5511f76045c %}

Our extension method is ready now, let put it to test.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mw17vbgqe7djilt9yllr.png)

As you see the code is perfectly working fine, and results do tally up.

I hope this gives a good idea of how to write an extension method in a way the configuration can be passed from outside. Here, the configuration is which field you want to sum up i.e. Salary & Stock.

Happy Coding !!
Let's Build an AWS Lambda in C#!
Tags: aws, lambda, csharp, tutorial
Published: 2021-04-22 16:27:27

---
title: Let's Build an AWS Lambda in C#!
published: true
description: A 6-part tutorial and guide to AWS Lambdas through the lens of C# software development
tags: aws,lambda,csharp,tutorial
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sj1aly7nud5ydgjnf8f8.png
---

At first glance, Amazon Web Services (AWS) can seem impenetrably complex, but it’s not so bad once you’ve found your way around it…

**A Lambda is** a lightweight, short-lived, event-triggered process that can run reliably whenever it is needed. AWS Lambdas are perfect for small tasks.

I've put together a short tutorial, to surface some of the concepts you'll need, and walk you through the process of building your first Lambda in AWS.

For this tutorial, we’ll build something a little more ambitious than the traditional “Hello world!” application, and through that I hope to demistify it a bit.

Read the full tutorial at: [instantiator.dev](https://instantiator.dev)

* [Part 1 - AWS, users, roles, permissions](https://instantiator.dev/post/csharp-aws-lambda-tutorial-01/)
* [Part 2 - build, deploy, invoke](https://instantiator.dev/post/csharp-aws-lambda-tutorial-02/)
* [Part 3 - APIs and secrets](https://instantiator.dev/post/csharp-aws-lambda-tutorial-03/)
* [Part 4 - locating logs](https://instantiator.dev/post/csharp-aws-lambda-tutorial-04/)
* [Part 5 - writing to S3](https://instantiator.dev/post/csharp-aws-lambda-tutorial-05/)
* [Part 6 - scheduling triggers](https://instantiator.dev/post/csharp-aws-lambda-tutorial-06/)
Calculating the Mean (Correction)
Published: 2021-04-22 15:44:52

Here is the program:

# Programmer: Johnny L. Hopkins 
# Date: April 20, 2021
# mean.py: Computing the aritmetic mean without using libraries

# We will use matplotlib for basic visualizations based on the mean
import matplotlib.pyplot as plt

# We need sample data to calculate the mean
# We do this by declaring a new list
list_values = {80, 75, 93, 88, 99, 100, 80}

# We will now build the equation for the mean by using 
# sum(), which takes the iterables in our list and sum over the 
# elements. To count the elements we will use len(). We can combine
# the sum() and len() to build the equation for the mean. We declare a
# new variable to store the value of the mean.
values_mean = sum(list_values) / len(list_values)

# We now will print out the mean to the standard output:
print("The mean is: ", values_mean)

# Finally, we will graph a histogram to see the distribution of values
# To output the histogram, we have to specify the list as the values
# to be graphed. If we don't specify a variable, an error is returned to
# standard output
plt.hist(list_values, density = 1)
plt.show()

Here is the output:

Windows PowerShell
Copyright (C) Microsoft Corporation. All rights reserved.

Try the new cross-platform PowerShell https://aka.ms/pscore6

PS C:\Users\hopki> & python c:/Users/hopki/OneDrive/Documents/mean.py
The mean is:  89.16666666666667
PS C:\Users\hopki> 


This comes directly from Visual Studio Code.
#11 of 100DaysOfCode
Tags: 100daysofcode, react
Published: 2021-04-22 16:05:21

Eleventh Day.
Today is all about routing.

## List Of Things That I Learned Today

* **How to use React Router?**
Just a note: React Router is a beautiful third-party library that can be used to implement lightning-fast client-side routing on our react application.
It's a beauty for real. Most of all you can declare patterns to get your routes and then we can just use the useParams hook to read the route.
* **Reading routes via use params.**
* **Applying a 404 page**: Nothing too serious just check if you have received the data, 
if not return markup for 404 page.
* **Implementing client-side navigation.**
* **Redirecting using the useNavigate hook.**
* **Link and NavLink components** 
```javascript
  <Link to='/nameOfTheRoute' >
    <Element you want to show/> or Text
  </Link>
```
Link is just a smart cousin of anchor tag it just got to attribute instead of href plus it's smart.


```javascript
  <NavLink 
    to='/nameOfTheRoute' 
    activeStyle={ObjectContainingStyles} 
  >
    <Element you want to show/> or Text
  </NavLink>
```
Link is smart but so is NavLink the only additional functionally it provides as you can see is activeStyle attribute and that is quite literal.
The additional styles that a nav link gets after we click on it.
Easy.

And that's all for today.😀
Thanks for joining me, comment down below if you got any suggestions.
Have a wonderful day.🌷
Updates from 82nd meeting of TC39
Tags: javascript, tc39
Published: 2021-04-22 14:49:34

There were several items in the agenda, this post mainly focuses on feature proposals.

__Stage 4:__

* Class Fields: 

[Private instance methods and accessors](https://github.com/tc39/proposal-private-methods)
[Class Public Instance Fields & Private Instance Fields](https://github.com/tc39/proposal-class-fields)
[Static class fields and private static methods](https://github.com/tc39/proposal-static-class-features)

__Stage 3:__

* [Intl Locale Info API](https://github.com/tc39/proposal-intl-locale-info) part of ECMA402: A proposal to expose Locale information, such as week data (first day in a week, weekend start day, weekend end day, minimun day in the first week), and text direction hour cycle used in the locale.

__Stage 2:__

* [Extend TimeZoneName Option Proposal](https://github.com/tc39/proposal-intl-extend-timezonename) part of ECMA402: Extend the timeZoneName option in Intl.DateTimeFormat object to support more formatted options.

* [Accessible Object.prototype.hasOwnProperty()](https://github.com/tc39/proposal-accessible-object-hasownproperty): Proposal for an `Object.hasOwn()` method to make `Object.prototype.hasOwnProperty()` more accessible.

* [Symbols as WeakMap keys](https://github.com/tc39/proposal-symbols-as-weakmap-keys): This proposal extends the WeakMap API to allow usage of unique Symbols as keys.

__Stage 1:__

* [Change Array by copy](https://github.com/tc39/proposal-change-array-by-copy): Provides additional methods to `Array.prototype` to enable changes on an array by returning a new copy of it with the change.

* [proposal-readonly-arraybuffer](https://github.com/Jack-Works/proposal-readonly-arraybuffer/) + 
[proposal-arraybuffer-fixed-view](https://github.com/Jack-Works/proposal-arraybuffer-fixed-view) shall be combined to one single proposal.

__Bonus update:__

The (stage 1) [Pattern Matching proposal](https://github.com/tc39/proposal-pattern-matching) has been updated, don't miss to read this! 

<hr />

<center><a href="https://twitter.com/GNUmanth">@gnumanth</a></center>
9Anime 9AnimeGG
Published: 2021-04-22 15:58:03

"9anime ✔️ 9AnimeGG ✔️ Watch High Quality Anime Online with SUB English, watch anime 9 Online videos and Get High Quality Anime Episodes for free. 9anime.gg is the best new version of 9anime website.

+ Website: https://9anime.gg/

+ Address: 5200 Irvine Blvd A, Irvine, CA 92620, United States

+ Email: 9animegg@gmail.com

+ Phone: +1 (714) 734-0200

Hastag: #9anime #9animegg #anime  #watchanime /m/0jxy"
Don't think of it as "Quitting"
Tags: career, advice, motivation, growth
Published: 2021-04-22 15:52:13

---
title: Don't think of it as "Quitting"
published: true
description: How can we reframe how we think about quitting our job.
tags: career, advice, motivation, growth
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/obx0sloros90yilz1bjw.jpeg
---

## Lets talk about leaving one job for another, 

and why this is scary, stressful at times but important to our growth.  

The first thing is the idea of “Quitting your job”.  This in itself has a negative connotation.  That you “Quit” on your team, “Quit” on your company and let people down you worked with.  Let's take a step back and reframe how we think about quitting.  First let's not call it quitting, let us call it leaving, resigning your current position or just moving on to new opportunities.  Let's remove that negative sentiment.  


Second, let's not think of it as failing your teammates and abandoning the company.  Think of it as the company failed to set you up for success.  The company failed you and you have recognized that it is time to take action and invest in yourself, your happiness and your growth as a person and engineer.  There are many reasons why we move on to different places in our careers and it is often a difficult decision to make especially when you are close with your team, and these moments can be bittersweet, but in the end you need to trust yourself and your intuition on what is best for you in this point in time.  You do not want to look back in years time and ask yourself “what if….I took that offer… what if I had the courage to take that interview and overcome imposter syndrome…what if I trusted myself in those moments”. 

I have said this before, but we are a sum of our experiences in life, both personally and professionally.  If those experiences and short and shallow then we are doing ourselves an injustice in our development.  This is the point in my writing where I usually ramble and let the brain to the typing, and I really want to quote a line from Transformers 1 but the other movies were so terrible I doubt anyone would remember, but fifty years from now and you are looking back at your life don’t you wanna say you had the guts to get in the car.


Cheers.
Open Source Tailwind CSS Components
Tags: webdev, tailwindcss, html, githunt
Published: 2021-04-22 15:47:19

<p>I <a href="https://josephamaurer.medium.com/framework-showdown-tailwind-vs-bootstrap-4adb740df21">wrote earlier </a>about the comparison between tailwind and bootstrap and in it I talked about how Tailwind lacked a formal component library for common UI elements. Fans of the Tailwind love its speed, simplicity, and powerful building capabilities. Critics aren’t a fan of its bloated HTML design and component-less delivery. To alleviate some of those concerns, I thought I would comprise a list of open source (and totally free) components for Tailwind.</p>
<h3><strong>Tailblocks</strong></h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*BX6NZrRDr9JNFvCvG6_Z7A.png"><figcaption>Source: Tailblocks</figcaption></figure><ul>
<li><a href="https://github.com/mertJF/tailblocks">Github</a></li>
<li><a href="https://tailblocks.cc/">Live Example</a></li>
</ul>
<p>Tailblocks is a project that provides multiple components that were built using tailwind css. It’s not a direct dependency that you have to add to your project, rather it provides the html scaffolding for you to use in order to add the components. Simply find a block you want to use, pick your accent color, pick if you want it to be dark mode or not, and copy/paste the generated html. Super&nbsp;useful!</p>
<h3><strong>Meraki UI Components</strong></h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*kOLzM_FiROWF6-7j"></figure><p>Meraki is a collection of 51 Tailwind Css components that support RTL languages and are fully responsive based on Flexbox and CSS grid. Everything from their cards to the sidebars look&nbsp;awesome!</p>
<ul>
<li><a href="https://github.com/bakateam/merakiui">Github</a></li>
<li><a href="https://merakiui.com/">Live Example</a></li>
</ul>
<h3>Tailwind Starter&nbsp;Kit</h3>
<figure><img alt="" src="https://cdn-images-1.medium.com/max/800/0*7ZFoXWWfUGKxpvVe"></figure><p>Tailwind Starter Kit is Free and Open Source set of 120 fully coded css elements. On top of that it has 4 sample pages to make getting started even easier. They do also have some dynamic components that require Javascript to get started. They are one of the few to fully support Angular, Vue, HTML, and&nbsp;React!</p>
<ul>
<li><a href="https://github.com/creativetimofficial/tailwind-starter-kit">Github</a></li>
<li><a href="https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation">Live Example</a></li>
</ul>
<p>Overall you can see that there are a number of open source options of there to help you get started using Tailwind. It requires a little bit more friction than Bootstrap that ships with a lot of these basic components, but it also gives you the ability to find what component style you really&nbsp;like.</p>
<p><strong>What are some of the Tailwind CSS libraries that you find useful? Comment them below&nbsp;👏</strong></p>
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=2c9656f0e3d0" width="1" height="1" alt="">
Google Africa Developer Scholarship (GADS) Program 2021
Tags: googlecloud, android, webdev
Published: 2021-04-22 15:43:53

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f7qwaonmlaic76vwjmta.png)
Grow With Google in partnership with Andela, and Pluralsight is launching 2021’s Google Africa Developer Scholarship (GADS) program to benefit technologists in Africa!
This is your opportunity to kick start your journey in tech or further advance your knowledge and skills on:
✅ Associate Android Developer
✅ Associate Cloud Engineer
✅ Mobile Web Specialist
This program aims to engage with existing and aspiring developers to help them build the skills they need to get a job in tech after the program is over. (GADS) program gives participants free access to select courses, projects, embedded labs (powered by Qwiklabs) and skill assessments; plus support from the Google Developer community. The resources available in this program will help developers build the skills necessary to get their Google certification.
🌐💻 Learn more and apply here : 
https://www.pluralsight.com/partners/google/africa/gads-2021
#GADS #GADS2021 #Google #scholarship #Andela #Pluralsight #Qwiklabs #cloud #Android #mobileweb #developer #certification
Responsive Footer In LESS
Tags: less, css, html, webdev
Published: 2021-04-22 15:37:55

Footer is defined important points like link, basic into, and social icons. So here we made the basic footer in less with the help of CSS properties and HTML.

Also Read:- LESS Responsive Login Form

In this element, we used LESS mixings, variables, and CSS flexbox properties. To make it more attritive and beautiful we used the best color combination for background color and text colors. To make responsive we used media queries.

Make it yours now by using it, downloading it, and please share it. we will design more elements for you.

[Source Code](https://w3hubs.com/responsive-footer-in-less/)