teleren/devto huggingface dataset:
Get your GitHub 2021 year of contributions in 3D
Tags: opensource, yearinreview, tutorial, career
Published: 2022-01-07 05:45:34

You probably remember all the hype that came out last year when [GitHub Skyline](https://dev.to/github/view-your-github-contribution-graph-as-an-animated-skyline-3d-print-it-2dpl) was released.

{% link https://dev.to/github/view-your-github-contribution-graph-as-an-animated-skyline-3d-print-it-2dpl %}

Social media was full of developers showing off their contributions. Now that 2021 has come to a close, it's time to check out your year of code. We also made some updates to Skyline.

## Your 2021 year of contributions as a city

[GitHub Skyline](https://skyline.github.com) was a beautifully crafted landscape showing each of your contributions on GitHub. It's your contribution graph in 3D! All contributions, including public and private will show up on your GitHub Skyline.

Here's how to get yours:

1. Go to [skyline.github.com](https://skyline.github.com)
2. Enter your username
3. Select "2021" from the drop down
4. Click "Create a Skyline"

From there you'll see your contributions magically appear. Now you can do some super fun things:
- Share your Skyline on social media using the "Share" button
- Order your Skyline direct from the website
- Download an STL file so you can print it yourself
- Use [ScreenToGif](https://dev.to/mishmanners/the-best-easiest-quickest-way-to-create-screen-capture-gifs-2754) or similar to create a fun animation to share
- Open [skyline.github.com](https://skyline.github.com) on your phone and use a headset to view your graph in virtual reality!

{% twitter 1479287176705691650 %}

Create your skyline and share it on social media. Create a story around why your city is massive, or sparse; maybe you intentionally left room in the middle of your city for a park! :palm_tree:

Did you find all the other hidden gems? Play around with the [Skyline website](https://skyline.github.com) to see if you can discover:
- Konami code
- Your skyline in ASCII art
- See the start of your 2022 skyline
- Get your personalised social media card

{% twitter 1479455047259856898 %}
DEVFORMS- A Server-Side solution for front-end devs
Tags: atlashackathon
Published: 2022-01-07 05:08:55

[Instructions]: # (To submit to the MongoDB Atlas Hackathon on DEV, please fill out all sections.)


### Overview of My Submission
DEVFORMS is a Server-Side solution for front-end developers which allows them to submit their website contact form data directly into their email address. During the whole process, they don't need to write a single line of code for server-side programming.

### Why DEVFORMS is developed?
Suppose you are a front-end developer or beginner who has a contact form on his/her website, doesn't have any server-side programming knowledge &, you want your website users to submit contact form data directly to your email address, so you can reach out to them. This is not possible without server-side programming, then what will you do? That's the reason it's developed, solves your problem by automating your task.


### Submission Category: 

- 
Choose Your Own Adventure


### Link to Code

- 
GitHub Link :- [https://github.com/Gulshanaggarwal/DevForms](https://github.com/Gulshanaggarwal/DevForms)

- App URL :- [https://devforms.netlify.app/](https://devforms.netlify.app/)

### Tech-Stack

- React

- Node(Express)

- MongoDB Atlas



### Additional Resources / Info

- 
Video demonstration :-

{% youtube BjSLKL9MQjc %}

- 
Screenshots-


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



![Create-Form window](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0mli0bja07lnutlok81l.png)



![Integration guide](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/831t8uhca9k1ufwp33bx.png)



![Form Settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kpcbxgp0ddavbb665pr6.png)



![Form Data into mail](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ortv32exmatzxjol2frp.png)




###My Inspiration
When I was building my portfolio, I was looking for something that can automatically send my form data to my email address. I tried so much through youtube, copy-pasted so much code to submit my form data but it did not really work for me because at that time I was just a beginner, trying all these things without any knowledge of server-side programming. Later, I found Formspree which is a backend solution for developers. Then I simply created a form on that website & pasted the URL inside my code. As I submitted the form, it automatically sent my form data to my email address. That thing fascinated me.
Go limit service time per user
Tags: go, concurrency
Published: 2022-01-07 06:09:15

---
title: Go limit service time per user
published: true
date: 2022-01-07 04:52:07 UTC
tags: #go #concurrency
canonical_url: https://enzircle.com/go-limit-service-time-per-user
series: "Go concurrency through problem solving"
---

In this problem, you are given a video processing service with a freemium tier. Everyone will be given 10 seconds of free processing time. If you are not a paying user, the service will kill your process after 10 seconds.

There are two variations for this problem. You can limit every 10 seconds for every request or limit 10 seconds for every user accumulated.

This article will discuss the first one, limiting every user to 10 seconds.

## Solution

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1641531217775/Qrf0oCq1y.png)

This solves the problem where you need to limit processing time for every user.

## Key takeaways

1. Use a similar pattern as the previous problem (limit service to 10 seconds per request), where I use a `select` block wrapped in a for-loop. 
2. Use `time.Tick` to write to a channel every second. And then, we check whether the user has reached ten seconds. Return the function if the user is not a premium user and has used all ten seconds.
3. To keep track of the accumulated time used, you should use mutex via the `sync.Mutex` package. In this problem, every time you receive a time tick, set a lock and then update the `TimeUsed` variable. Check if the user has used up their ten seconds. If they have and are not premium, return false to mark that the process has to be killed.
Explore react some topics in react
Published: 2021-12-26 18:02:01


PropTypes:  propTypes means in the component we can write what type of props is this. As a data type is a string, number, boolean, or anything we can pass these props types.

What is the difference between State-props: 
		Props only send the value. It is read-only. can not change the value by props. And we can send anything like hardcoded value, dynamic value, object, function.

State
Props
State can get initial value from parent component
Props also can get initial values from the parent component.
State can not change by parent component 
Props can be changed by parent component
State can set default value in the component.
Props also can set default values in components.
State cab change inside the component 
Props can not be changed inside component.
State can not be changed in child component 
Props can be changed in the child component.



Explain the Component Lifecycle.

=>  Lifecycle method happened three ways
Mounting: In mounting, we maintain some order. These are 
contractor() 
Static getDerivedStateFromPorps()
render()
componentDivMount()

Updating: In updating also maintain some orders. there are 
Static getDerivedStateFromPorps()
shouldComponentUpdate()
render()
getSnapshotBeforeUpdate()
componentDivUpdate()

Unmounting: when the component deletes from the DOM. Then it is called 
componentWllUnmount()
4. What is hooks in react?
	Hooks is create a connection with our application to react.
	We use some hooks:
useState: this hook is used to update any value. if anything changes or needs to update 
In the application useState hooks can update this.
useEffect: by this hook, we can load data or fetch data in UI. it’s also like an impure function.if 	
	Loaded data is not loaded from the server it can not be rendered.
	
There are more hooks like this that are building a connection with code and rendering in UI.


5. Virtual DOM and diffing- algorithm?
	Virtual DOM: virtual DOM is most like real DOM.in real DOM we trigger any element by methods like getElementById or getElementByClassName and then change the code. Sometimes if needed to change somewhere then all structures should be changed this was very time-consuming and most difficult. But now VIrtual DOM is made our life easier.
	In virtual DOM initially set a DOM. when we change code then automatically create a new DOM and compare the previous DOM and then update the DOM.this this is created a Tree which is rendered from the root and his parent is app.js. All component is stored in app.js and finally rendered in UI by root. This tree most looks like real DOM. All processes are happened by diff algorithms. It means when anything changes in code then it is compared with virtual DOM and then they create a Diff algorithm. and then reference change or update in UI.
How I Made a Website That Removes Ads, Bypasses Paywalls for Articles
Tags: instructions, projects
Published: 2022-02-05 07:57:26

---
title: How I Made a Website That Removes Ads, Bypasses Paywalls for Articles
published: true
date: 2022-01-07 04:41:02 UTC
tags: Instructions,projects
canonical_url: http://wasi-master.github.io/blog/2022/01/07/how-i-made-a-website-that-removes-ads-bypassed-paywalls-for-articles/
---


Yesterday I built a simple website that takes in a URL and removes all ads and paywalled content and you can host it locally. The UI is very nice and pleasing. It uses google's `User-Agent` to pretend it's google and gets the same content that the URL would give to google.

<!-- more -->

## Motive

I read a lot of articles, some of them have a paywall. And I don't really want to pay money to just read one article. If it was something I use daily then I could consider paying for it but for only once, no. So I usually go to [12ft.io](https://12ft.io) for that but that website doesn't work for New York Times so I wondered if there were any alternatives. Then I thought to myself why wouldn't I be able to make one myself? So here we are now.


## Their Implementation

I first scrolled to the bottom of the [12ft.io](https://12ft.io) page and saw an explanation of how it works:

> The idea is pretty simple, news sites want Google to index their content so it shows up in search results. So they don't show a paywall to the Google crawler. We benefit from this because the Google crawler will cache a copy of the site every time it crawls it. All we do is show you that cached, un-paywalled version of the page.

So it depends on google crawler's cache? Cool. But what if the site isn't cached? I tried it with my own blog and it worked but couldn't show the full page for some reason.

## My Implementation

So they load the cached version of the page the google crawler loaded.
My website pretends to be the google crawler and no caching is required. And it can optionally cache those pages locally and there's no need for google to get involved.

## So how to use it?

You can click the image below to go to the GitHub repo containing the project and in there you'll find instructions on how to set this up and how to use it.

[![wasi-master/13ft - GitHub](https://gh-card.dev/repos/wasi-master/13ft.png)](https://github.com/wasi-master/13ft)
[Day 5] Another Dapp 
Published: 2022-01-07 04:32:44

Day 5, let’s get it! Today was another weird day, tbh the whole weeks been shot but hey I’m still learning and still grinding and that’s all that matters!

All of my code can be found at this [Github Repo]("https://github.com/ChaseStruse/VideoGameMarketplace")

## What did I do? 

- Researched Solidity best practices
- Spent time experimenting with contracts
- Wrote a storage contract and am attempting to get a purchase contract built

## What did I learn?

- Learned how to have inheritance in Solidity
- Learned how to deal with storage

## Any Side Notes? 

- Gotta keep the grind going!
Web Scraping with Laravel and spatie/crawler
Tags: laravel, spatie
Published: 2022-05-22 02:47:32

---
title: Web Scraping with Laravel and spatie/crawler
published: true
date: 2022-01-07 04:15:00 UTC
tags: Laravel, Spatie
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kzm6wcel93l48aafaz5c.jpeg
canonical_url: https://anlisha.com.np/blog/web-scraping-with-laravel-and-spatie-crawler/
---

Probably among many articles on _Web Scraping With PHP_, you may find something useful here along the lines.  
We’ll be using spatie/crawler package which will provide us with a great features for writing crawlers without going absolutely crazy!  
Please keep in mind that there is no general “the best way” — each approach has its use-case depending on what you need, how you like to do things, and what you want to achieve.  
Note: Before you scrape a website, do read their Terms of Service to make sure they are OK with being scraped.

**Use Case**

Build our own crawler project to fetch content of any websites.

**Set Up & Installation**

Install package via Composer:

```
composer require guzzlehttp/psr7 ^1.8.3
composer require spatie/crawler
```

Notice that guzzlehttp/psr7 is installed because spatie package uses Guzzle promises under the hood to crawl multiple urls concurrently.

**Coding Time!**

Before we start, we need to create a class which extends the `\Spatie\Crawler\CrawlObservers\CrawlObserver` abstract class. We can hook into crawling steps and manipulate http responses in our `CustomCrawlerObserver` class.

{% gist https://gist.github.com/anlisha-maharjan/cc5eab50624907ed267c1ce5525607c4 %}

Then, we can now prepare the crawler itself using syntax below and start it:

{% gist https://gist.github.com/anlisha-maharjan/b2a67fcb968e7c881d68308c82aedf19 %}

Note on line 26, we set the `CustomCrawlerObserver` class created earlier. And on line 32, we set the website to crawl.  
Also on line 27, we’re defining that we only want to follow internal links by using `setCrawlProfile`-function. Check out other options [here](https://github.com/spatie/crawler#filtering-certain-urls).  
Do you see `setDelayBetweenRequests(100)`? It makes the crawler pause 100 milliseconds between every request.

**That’s it**  
Quick and easy! [spatie/crawler](https://github.com/spatie/crawler) provides options/features to set maximum crawl depth, response size, adding a delay between requests, limit the crawl links, limit content-types to parse etc. that simplifies the process of web scraping. While this was an introductory article, you may choose to build on this knowledge and create complex web scrapers that can crawl thousands of pages. So make sure you access this package for more documentation.

**Source Code!**  
 [Here’s the full source code with what we’ve done so far.](https://github.com/anlisha-maharjan/laravel-web-scraping)

The post [Web Scraping with Laravel and spatie/crawler](https://anlisha.com.np/blog/web-scraping-with-laravel-and-spatie-crawler/) first appeared on [Anlisha Maharjan](https://anlisha.com.np/blog).
A starter blueprint to help fast track a new Rails applications
Tags: rails, ruby
Published: 2022-01-07 04:09:04


To help fast track setting up new Rails applications, I created a blueprint outlining steps for adding common functionality using some [handy templates](https://railsbytes.com/public/templates).

[https://github.com/dalezak/rails-blueprint](https://github.com/dalezak/rails-blueprint)

To get started, simply clone the repo into a folder with the name of your application.

```console
git clone https://github.com/dalezak/rails-blueprint.git my_app
```

Then move through the list in the [README.md](https://github.com/dalezak/rails-blueprint/blob/main/README.md) doing any of the sections your application needs, and skipping sections you don't need.

This is still a work in progress, so plan to add new sections as well as provide other options for existing sections. If there are sections you'd like to see, [let me know](https://twitter.com/dalezak).
Dev Log[0]
Tags: webdev, javascript, react, career
Published: 2022-01-07 03:15:40

## An Introduction

Hi, my name is Craig and blogging a new part of my coding journey. I've been coding for over a year now and have enjoyed it so far. My goal is to become a front-end developer that specializes in React. I also hope this helps whoever devices to follow me in this process. 

---
## Why Blog?

There are several reasons, one of the reasons if for a personal journal of the things I've encountered in pursuing this tech career. Another reason I'm starting a blog is to showcase the knowledge I've gained, while at the same time I hope to gain a deeper understanding of the front-end ecosystem. 

---
## Blogging Topics

I currently plan on starting small by brushing over basic knowledge and will quickly move to more advanced topics such as ReactJS. My posts may not follow a strict path, but will definitely stay in the front-end development space.
How to Schedule Tasks in a Blazor Gantt Chart Component
Tags: blazor, webdev, dotnet, csharp
Published: 2022-01-07 03:49:56

Learn how to schedule tasks in a Syncfusion [Blazor Gantt Chart](https://www.syncfusion.com/blazor-components/blazor-gantt-chart) in a Blazor WebAssembly app. This video explains how to schedule tasks based on the workweek, holidays, working time range, and task scheduling modes in the Gantt Chart.

Product Overview: https://www.syncfusion.com/blazor-components/blazor-gantt-chart

Example project: https://github.com/SyncfusionExamples... 

Explore tutorial videos: https://bit.ly/3fAz0Ch

Documentation : https://blazor.syncfusion.com/documentation/gantt-chart/scheduling-tasks

{% youtube NaJboeV7q44 %}
🤔 What Suggestions Do You Have for this Discord Server?
Published: 2022-01-07 03:39:56

For the Fairfield Programming Association, we're going to be launching a Discord server. But, we really want your feedback about how you think the server should function and what features you want. We have one of the best bot programmers that there is working on our discord bot, but we don't want the server to be an average one. 



So, we thought that we should get feedback from you guys about what you like about the server and what you would change. Also, if you have any features you would suggest, please let me know, I would love to hear them. 

[You can see the server here!](https://discord.gg/r2JnDXvrWt)
VS Code IDE GUI Automation
Tags: vscode
Published: 2022-01-07 03:07:51

Hi guys,
I am trying to automate the VS code IDE itself. This involves GUI automation of IDE where I can control each element on VS Code IDE. 
i.e. Build project, run piece of code, debug or profile. 
I looked through bunch of options like Squish and Mocha however couldnt find any option which can help to automate VS Code IDE GUI. Its based out of Electron and there seems to be nothing out there which can help. 
Looking some support from community here for any pointers.

Thank you!
MAKING A FLAWLESS SHOPIFY WEBSITE WITH OUR AMAZING SHOPIFY PACKAGES OF ARROWTHEME
Tags: shopify, tutorial, shopifypackages, discuss
Published: 2022-01-07 02:39:58

After a long period of operation, now is the greatest time to refresh your Shopify website to ensure that it is constantly in top shape. Therefore, taking advantage of our Shopify Updates services is far necessary. 

**What makes our Shopify packages special? **
Back-end Updates Services are included in our sale program, and our Shopify professionals will add new features and upgrade versions for your ecommerce website.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tmizcj1zp4wnijmwzlqj.png)
Equally important, you also need to think about modernizing your Shopify website's front-end. Our Front-end Update Services have the help of professional and experienced Shopify experts that will reskin the homepage, generate new eye-catching landing pages and banners for your site.  
Additionally, if you have any particular requirements, don't overlook our Custom Shopify Website Development services. Whatever your requirements are, we will find the most suitable solution for you. 
Let’s grab this great deal right now! 
Click [https://arrowtheme.com/shopify-package/](https://arrowtheme.com/shopify-package/)
Laravel 8 Import Export CSV/EXCEL File Example
Tags: laravel, laravel8, import, export
Published: 2022-01-07 02:34:42

In this post I will give you laravel 8 import export csv and excel file example. We will simple create import data to xls, csv file and also we will import data to database using csv file in laravel 8 application.

Using maatwebsiteexcel laravel 8 example you can easily import and export csv and excel file. For laravel 8 import csv/excel file use import class, laravel 8 export csv/excel file use export class.

Using this example we can easily import and export and download the csv & excel file from the database using the maatwebsite/excel composer package.  

maatwebsite/excel provide easy way to import and export csv file in laravel 8 using database model.

So let's start how to import csv and excel file in laravel 8.

```
Step 1 : Create new project in laravel 8

Step 2 : Database Setup

Step 3 : Install Package

Step 4 : Create Some Dummy Records Using Tinker

Step 5 : Create New Route

Step 6 : Add Controller

Step 7 : Create Import Class

Step 8 : Create Export Class

Step 9 : Create Blade File for View
```

---

> **_[Read More : Laravel 8 Import Export CSV/EXCEL File Example](https://techsolutionstuff.com/post/laravel-8-import-export-csv-excel-file-example)_**
100 Days of Code - Day 6
Tags: 100daysofcode, html, css, project
Published: 2022-01-07 02:30:07

Started section 4 of [Modern HTML & CSS From the Beginning](https://www.udemy.com/share/1013eA3@vWdDAwIbTNKVDgdoKRg7QR2jUvRHDQ3ZaF3Dd-HzUhJUlzvcDZZUUPGMPdldaX2q/) which is a simple project of creating a website for a hotel using just HTML and the basic CSS covered in section 3. I have decided while doing the projects in this course I want to practice committing often and writing good commit messages. The first part of the section was setting up the file structure and creating the navbar on the index.html page. With my wanting to practice improving my commits, this one part took over an hour so I think starting tomorrow I think I'm going to change my approach to the rest of this section. Since I already have web development knowledge from the bootcamp I took, I'm going to challenge myself to finish the rest of this project on my own as opposed to following along in the video and see how close I get to the courses end result. Wish me luck!