teleren/devto huggingface dataset:
Making a web component that makes kittens cry, apparently
Published: 2021-05-04 18:36:46

I like to find shortcuts for programming problems. While working on the ELMS:LN web components project, I noticed they like to copy-paste br tags to show off intersection observers. So, to make life easier, I made a simple b-r tag. It apparently makes kittens cry.

## Intersection observers
These are used for conditional rendering. An element on the page using intersection observers will not render until the viewable page is within a certain range of the element. For example, say at the end of a long webpage is a [wikipedia element](https://github.com/elmsln/lrnwebcomponents/tree/master/elements/wikipedia-query). The actual rendering of the wikipedia page, and the API calls to get the information, won't occur until the element is visible on the page. This is very helpful for slower or more taxed connections. 

## b-r
The b-r tag does not use intersection observers, but it was created to show off the usage of it. [b-r](https://github.com/elmsln/lrnwebcomponents/tree/master/elements/b-r) has two modes; numbered and automatic. The developer can supply an amount of br tags to insert, and the element will create the line breaks. If no input is supplied, the tag will get the height of the viewable window and insert br tags to push the rest of the content off of the screen. 

## Feedback loops
My first solution was not elegant, but it worked. (Shamefully, my mentality with most first iterations.) I had a simple for loop to add the tags to the page. During my IST 402 class, my professor used my tag to teach on tag properties and a different way to add tags to html code. He also helped us understand how to make a tag stateful. Honestly, the best help this tag needed.

## The kittens
b-r is a tag I made in less than a day for a specific use case. I know copy-pasting a br tag is easy, I'm guilty of that. While the first iteration of just user input was not extremely helpful, I believe the second iteration of conditional numbering based on window height can be useful when working across developers.

## Final thoughts on Web components
This is by far not the last web component I will make or work on; My barcode-reader still has a ways to go. Maybe I'll get the chance to bring that project to THON. Either way, web components are here to stay, and I don't plan on going anywhere. Highly adaptable, very useful, and easily portable.
Except with dev.to. Social media isn't really my thing, but I try to stay updated. So expect monthly(?) updates.
How to launched a startup while studying.
Tags: startup, programming, watercooler, showdev
Published: 2021-05-04 18:11:10

Do you also want to start a startup while studying in collage.Here is my way how I have done that.
*Let's Start*
1) **Start with why?**
Your first question must be why you want to start a startup. Your goal must be clear on that. *I just want to do something different from others and I really like making projects.*
2) **Find what are you good at.**
Everyone is good at their favourite domains,so think of a startup in which you are good at. For example-> may be in **data science, web development** etc
*In my case I am good at web development ,machine learning and management* so I found a startup on this domain.
3) **Find a technology which you need to integrate.**
After getting idea you need to look up for better and clear *technology*.Explore the *technology* which will give edge to your startup. *In my case I just need to show it to the world, so i created a web page for doing the same and integrated it with different technology.*
4)**Managing and sustaining it with studies.**
Getting a **Client** in any startup is the real hard work which you need to do it with precision. You need to analyse your whole time and look up the better time which you can give.

**About my startup.**
Recently I have launched Projectron a major and minor project making site for students on different domains.
*I have a experience of making 20+ projects on different domains, so I was thinking why dont't I help other students to achieve their goal.* And here comes the idea for my startup and successfully launched it.

**I am happy to share that we are getting good response.**
You can visit at projectron--> http://projectron.tech/  

*I hope you find this post useful.*
**Thank you**
**Rishabh Dwivedi**
CPANdeps end of life
Tags: perl, cpan, dependencies
Published: 2021-05-04 17:53:56

---
title: CPANdeps end of life
published: true
description: CPANdeps is going away soon
tags: perl, cpan, dependencies
//cover_image: https://direct_url_to_image.jpg
---

Back in 2007 I wrote CPANdeps, a web site which analysed dependencies between distributions on the CPAN, and displayed them along with their [CPAN testers](http://www.cpantesters.org/) results.

I have decided to retire it, for several reasons. First, [metacpan](https://metacpan.org/) has sprouted tentacles to do the dependency analysis. Second, the code is a mess and it needs quite a bit of work to cope with the current size of the CPAN-testers database. But third, and most importantly, the employer that I left over a year ago are withdrawing the free hosting.

I've not actually _used_ the site myself for a while, preferring the [command line version](https://metacpan.org/pod/distribution/CPAN-FindDependencies/bin/cpandeps). That, like metacpan, doesn't include test results, but I've found that I generally don't care much. Nigh on everything Just Works on every platform I care about.

It's going away on or shortly after the 17th of May. If anyone would like to take it over and host it themselves please email me.
Download CSV File from SpringBoot RestAPI + MySQL 
Tags: csv, mysql, springboot, restapi
Published: 2021-05-04 17:52:37

https://grokonez.com/spring-framework/spring-boot/download-csv-file-from-springboot-restapi-mysql-using-apache-commons-csv-spring-jpa

Download CSV File from SpringBoot RestAPI + MySQL – using Apache Commons CSV + Spring JPA

In the tutorial, we show you how to create a SpringBoot RestAPIs application that uses Spring JPA to get data from MySQL records and uses Apache Commons CSV library to write data to a CSV file.

Related posts:
- <a href="https://grokonez.com/java/java-read-write-csv-file-apache-commons-csv">Java – How to read/write CSV file with Apache Commons CSV</a>
– <a href="https://grokonez.com/java-integration/use-spring-jpa-mysql-spring-boot">How to use Spring JPA MySQL | Spring Boot</a>
- <a href="https://grokonez.com/spring-framework/spring-boot/multipartfile-create-spring-ajax-multipartfile-application-downloadupload-files-springboot-jquery-ajax-bootstrap">SpringBoot – Upload/Download MultipartFile to FileSystem – Bootstrap 4 + JQuery Ajax</a>

<!--more-->
<h2>Technologies</h2>
- Spring Boot - 2.0.6.RELEASE
- Spring JPA
- MySQL
- Apache Commons CSV - 1.5
<h2>Practice</h2>
Project Structure ->

<img src="https://grokonez.com/wp-content/uploads/2018/10/springboot-restapi-download-csv-file-from-mysql-using-spring-jpa-apache.commons-csv-project-structure.png" alt="springboot-restapi-download-csv-file-from-mysql-using-spring-jpa-apache.commons-csv-project-structure" width="329" height="306" class="alignnone size-full wp-image-15227" />
<h3>Create SpringBoot project</h3>
Use SpringToolSuite to create a SpringBoot project with below dependencies:

<pre><code class="language-html">&lt;dependency&gt;
    &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
    &lt;artifactId&gt;spring-boot-starter-web&lt;/artifactId&gt;
&lt;/dependency&gt;      
&lt;dependency&gt;
    &lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
    &lt;artifactId&gt;spring-boot-starter-data-jpa&lt;/artifactId&gt;
&lt;/dependency&gt;   
&lt;dependency&gt;
	&lt;groupId&gt;org.springframework.boot&lt;/groupId&gt;
	&lt;artifactId&gt;spring-boot-starter-thymeleaf&lt;/artifactId&gt;
&lt;/dependency&gt;
&lt;dependency&gt;
	&lt;groupId&gt;org.apache.commons&lt;/groupId&gt;
	&lt;artifactId&gt;commons-csv&lt;/artifactId&gt;
	&lt;version&gt;1.5&lt;/version&gt;
&lt;/dependency&gt;
&lt;dependency&gt;
    &lt;groupId&gt;mysql&lt;/groupId&gt;
    &lt;artifactId&gt;mysql-connector-java&lt;/artifactId&gt;
&lt;/dependency&gt;</code></pre>
<h3>Customer Model</h3>
- <code>Customer.java</code> ->

More at:

https://grokonez.com/spring-framework/spring-boot/download-csv-file-from-springboot-restapi-mysql-using-apache-commons-csv-spring-jpa

Download CSV File from SpringBoot RestAPI + MySQL – using Apache Commons CSV + Spring JPA
git - how to avoid weird situations while pulling from remote repository
Tags: git
Published: 2021-05-04 17:40:16

I use rebases in my workflow, and I never run `git pull`. `git pull` is `git fetch` + `git rebase`; and it makes more sense to run those two commands separately. After fetch you can see if there were a lot of changes, and it's more natural to do `git rebase --abort` and go back to the pre-rebase state

Instead, I do as follows:
* I use my alias `git tree`, which translates to `git log --oneline --graph --decorate --all`. There I can see what kind of changes I'm about to rebase on
* If it goes very bad, I rebase not on `origin/master` but few commits before. In this way, I can fix conflicts more step by step
* if you have to solve conflicts, it makes sense to squash your commits on a branch to an almost final state. If you have 5 commits, it can happen that the same conflict you will have to fix 5 times. If you squash it into 1, same work; but you don't have to repeat it
* as a last resort, you can use git merge `origin/master`. Git often manages merges ok, and if you care about tree shape (no merge commits, and personally I avoid them) you can just `git checkout <the-result-of-merge>; git reset origin/master` and create a new commit with just with the file changes

I general, if you work with a team that uses a workflow that uses rebases, you should learn a bit more about git internals & branching. Good materials on that are:
* visual, game-like explanation - https://learngitbranching.js.org/
* the chapter on git internals in Pro Git book: https://git-scm.com/book/en/v2/Git-Internals-Plumbing-and-Porcelain
Java Regular Expression to extract data from a Text
Tags: java, regular, expression
Published: 2021-05-04 17:38:53

https://grokonez.com/java/java-sample-practices/java-regular-expression-to-extract-data-from-string

Java Regular Expression to extract data from a Text

This tutorial shows you how to extract data from a Text using Regular expression.

Related article: <a href="https://grokonez.com/java/java-core/java-regular-expression-overview-syntax">Java Regular Expression Overview – Syntax</a>

<!--more-->
<h2>I. Problem</h2>
Assume that we already have a string that contains Weather data like this:
<img src="https://grokonez.com/wp-content/uploads/2017/02/regex-datatable.png" alt="" width="286" height="59" class="alignnone size-full wp-image-2814" />
What we need is to store them in Java Objects using Regular Expression.
<h2>II. Practice</h2>
- First, we need a data model class to store Weather data for each item we get.
<pre><code class="language-java">
public class Weather {
	private String location;
	private int temperature;

	// constructor, getter/setter methods...
}
</code></pre>
- Next, we have to make our own pattern to extract data (location, temperature) from input text.
There are many ways to do this, for more details for how to choose syntax for the string pattern, please read this article: <a href="https://grokonez.com/java/java-core/java-regular-expression-overview-syntax">Java Regular Expression Overview – Syntax</a>.
In this case, we can create a pattern like this:
<pre><code class="language-java">
String pattern = "(Location:)(\\s*.+)(,)(.*Temperature:\\s+)(\\d+)";
</code></pre>
You can see that we have 5 groups, the data we need are only in the 2nd group and 5th group.
So the Java code should be similar to:


More at:

https://grokonez.com/java/java-sample-practices/java-regular-expression-to-extract-data-from-string

Java Regular Expression to extract data from a Text
thinking to myself when setting up a project boilerplate
Tags: angular, architecture, javascript, boilerplate
Published: 2021-05-04 17:33:39

---
title: thinking to myself when setting up a project boilerplate
published: true
tags: angular, architecture, javascript, boilerplate
description: insert arbitrary but nice desc here
cover_image: https://images.unsplash.com/photo-1531429962657-7f21d228a9b2?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1491&q=80
---

this is a **thinking out loud** to myself.

### how to prepare a SPA in different frameworks/libraries but also in angular

1. `ng new` `create-react-app` `vue cli`
2. enable router
3. enable i18n strategy
4. enable store / reduxy stuff
5. bind router into store
6. ensure your API with smthng [like](https://marketplace.visualstudio.com/items?itemName=humao.rest-client)  or `curls` / postmany stugff 

* test GET / POST/ UPDATE
* brief moment of think: do we need to auth? if so handle auth token with like setLocalStorage

7. create an entityfolder for selected endpoint, (if angular, also create a module here!!)
8. create model/type declartion (only if typescript, which we prefer) of entities
9. create service to consume any http-client (eg axios) // consider auth process  

 * test GET / POST/ UPDATE `loadAll()`, `oneOneById()`, 
`postNew()`, `update()`, `delete()` for selected entity

10. test servicemethods in bare minimum but routable component, most liekly in lifecycle method of given framework
11. from now on we would need to distungiush from framework to framework/library which should be more articles, 

in angular -which we atm work with- we go with:

12. create routeresolvers
13. prepare actions / reducer / selectors from ngrx, naivly bind http service into the loadaction (we like ngrx-entity here) 
14. access store in template and trigger action for udf to ensure actions work
15. create effect for entity -> `loadAllEntity` -> http-service -> dispatch `loadAllEntitySucess`, bind result into store
16. we forget about, register router, effect, store, store-router in module, considering it silently given from now on, knowing forRoot() and forFeature(). 
17. remove 3 from template
18. consume loadEntity from action in routeresolver -> which should also will trigger the effect -> which will trigger the http -> which will trigger store binding
19. bind observable/subscriber to store in template list view
20. prepare route for single entity
21. access route, write resolver that gains single entity from store / write actions..... from here on
22. rinse repaet

quod erat demonstrandum.
So Where Do I Deploy My App ??
Tags: devops, webdev, aws, heroku
Published: 2021-05-04 17:14:44

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

# So Where Do I Deploy My App ??

## There are serveral platofroms to deploy your app

## It depends on the complexity and use of your app

# If you just want to show case your app you can use one among these 👇

# Heroku

- Heroku is a cloud platform to host your apps simply
- You only need to know basic git commands
- It comes with no cost but you can deploy 5 app max
- Widely used by Developers

# Netlify

- You can deploy unlimited deploys
- Widely used by Developers

# Github Pages

- You can deploy unlimited apps
- Can use github actions for automations

# When It comes to Scalability

# AWS

- You can deploy unlimited Apps for an developer or an enterprise plan
- Recommended By Developers
- Even Dev.to is deployed on AWS 
# Azure
- You can deploy unlimited Apps for an developer or an enterprise plan

# And More ..

# Conclusion

## Every Service has its own pros and cons

# Keep Coding !!!

# 🙏 Share with your friends on [Twitter](https://twitter.com/intent/tweet?text=%20%20So%20Where%20Do%20I%20Deploy?%20%20https://dev.to/alestor123/so-where-do-i-deploy-eah "Share It")
Bases JavaScript: variables
Published: 2021-05-04 16:43:08

Las variables son cajas en los que puedes almacenar valores. Debes declarar la variable con la palabra var y después darle un nombre, ejemplo:

var x = 5;
var y = 10;

Puedes escribir cualquier nombre desde que no se vuelva a repetir y teniendo en cuenta que JavaScript reconoce las mayúsculas y las minúsculas.
How to set-up Visual Studio Code to get started with react-native?
Tags: reactnative, vscode
Published: 2021-05-04 16:36:33

React-Native is a game changer when it comes to mobile-apps Development. You can use React-Native for modifying your existing android/ios or you can create a whole new app from scratch.
In this article I will teach you to set your developer environment with visual studio code which allows you to get started with react-native quickly. So, let's get started by following all the given steps.

<h2>STEP 1: Go to your command prompt</h2>
<p>Open up your command terminal by simply searching for "command prompt" in your search bar. First of all you have to install the latest version for node(https://nodejs.org/en/).If you have already installed, you can check that up by typing "node -v" in your command promt. </p>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/616wxtrxmc0z8q9qf7fc.PNG)
After you successfully confirmed your node installed, you can now further type in "npm i -g expo-cli"
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vclkx4n7m39e7545z7y9.PNG)
This will install the expo command line interface(CLI) which hides alot of complexity while building the native apps.

<h2>STEP 2: Open up Visual Studio Code</h2>
<p>Go to the terminal of vs code and type in "expo init your-project-name"</p>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rglg3rb5i6v1ob89b99s.PNG)
This will install all the necessary modules needed to build an react-native application.

<h2>STEP 3: Install NPM modules</h2>
<p>Initialize package manager by typing in "npm init" and after that install the modules for npm by typing "npm install" and at last start your application with "npm start" </p>

<h2>Conclusion:</h2>
Now, everything is set-up and you can play around with react-native pretty much in no time.You can download android emulator
(https://developer.android.com/studio) and run your application on it.This is it :)

Thank you so much.
What is Cloudflare SSL Certificate & How to Install it?
Published: 2021-05-04 16:27:26

 

How to Enable Free SSL Certificate From CloudFlare
The full model of SSL encryption provides from end-users to Cloudflare and from its origin server. On your origin server, an SSL certificate is required. There is 3 option for installing the server in full SSL mode: one is issued by a Certificate Authority (CA), one is issues by Cloudflare (Origin CA), and last is a self-signed certificate. It is recommended that you should always use a certificate that is obtained through Cloudflare Origin CA.

MODES OF OPERATION
Depending on the level of security requires and the amount of configuration you need the different modes of Cloudflare SSL to operate accordingly. The end-users’ traffic will always be encrypted which means your website will still enjoy the benefits of HTTPS. There can be a variety of ways through which traffic between Cloudflare and origin server can be configured.

Also Read – Top FREE SSL Certificate Providers

FLEXIBLE SSL

The end-users’ data on your website is encrypted in flexible SSL traffic from Cloudflare but not from Cloudflare to your origin server. This way is one of the easiest of enabling HTTPS on your origin without any installation requirement of an SSL certificate. It is not as secure as other option but flexible SSL helps in protecting your visitors from large scale threats including public Wi-Fi snooping and ad injection over HTTP.

ORIGIN CA

Origin CA does not use the certificate issued by the Certificate Authority (CA). It uses a Cloudflare-issued SSL certificate. The friction and configuring SSL on your origin server is reduced and also still secure the traffic from your origin to Cloudflare. You can generate a signed certificate in the Cloudflare dashboard instead of issuing a certificate signed by the CA.

HOW TO SETUP CLOUDFLARE FLEXIBLE SSL FOR WORDPRESS


https://comparecheapssl.com/what-is-cloudflare-ssl-certificate-how-to-install-it/
Defensive Programming
Tags: defensiveprogramming, software, programming, coding
Published: 2021-05-04 16:25:51

**Defensive programming** is the practice of anticipating problems that may arise in a software system and writing code to keep the system in a good state when such problems occur. A common way to apply defensive programming (also called defensive coding) is by **verifying inputs to individual functions or methods**. The guard clause pattern is a common way to perform validation of inputs while also minimizing complexity in the function.

```Defensive programming is when a programmer anticipates problems and writes code to deal with them.```

Defensive programming's techniques
1. **Check all data from external sources**: when obtaining data from files, networks, or external sources, check the value of the data obtained to ensure that it is within the date range. **Example**: When we request user's age, It should be a positive number, and maybe not larger then 150?

2. **Check the parameters values for the methods**: **Example**: Train Arrival time should be a Datetime type, not null or random integer numbers.

3. **Decide how to deal with incorrect data**: discovering an incorrect parameter, how do you deal with it? Depending on the situation, you can choose the mode that suits you, either by asserting or maybe throwing exceptions?

### Real life scenarios?

1- If you are developing an API as a software engineer, you should check for all the values provided through the REST verbs in the controller side.

2- More coding examples:

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

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

#### Conclusion

The beauty of this defensive programming technique is that it costs almost no time to add exhaustive type checking to your code. Also it is a build up technique, It makes your application more solid against different types of invalid inputs.
Control mac Sound Volume By Python
Tags: python, mac
Published: 2021-05-04 14:44:27

In this post, I will introduce a python package, `osascript` that allows us to control the sound volume easily.

{% github andrewp-as-is/osascript.py %}


If you prefer to use nodejs, I recommend you check this out.
https://github.com/mikaelbr/node-osascript

If you are a Windows user, I recommend you to try pycaw
https://github.com/AndreMiras/pycaw


What we can do with `osascript` is to set volume and get volume information without writing AppleScript.

AppleScript
>AppleScript is a scripting language created by Apple. It allows users to directly control scriptable Macintosh applications, as well as parts of macOS itself. You can create scripts—sets of written instructions—to automate repetitive tasks, combine features from multiple scriptable applications, and create complex workflows.

https://developer.apple.com/library/archive/documentation/AppleScript/Conceptual/AppleScriptLangGuide/introduction/ASLR_intro.html

AppleScript is promising when we want to do control macOS's functionalities, but personally, I don't really like to write it lol.

### Install
```zsh
$ pip install osascript
```

### Set volume
```python
import osascript
target_volume = 50
vol = "set volume output volume " + str(50)
osascript.osascript(vol)

# or
target_volume = 50
osascript.osascript("set volume output volume {}".format(target_volume))

# or
osascript.osascript("set volume output volume 50")
```

### Get volume info
The return format is <class 'tuple'> and what we need is `output volume` to know the current sound volume.

```zsh
(0, 'output volume:50, input volume:58, alert volume:100, output muted:false', '')
```

The way to get the current volume is straightforward.
Get the volume settings via `osascript` and parse the tuple.

```python
result = osascript.osascript('get volume settings')
print(result)
print(type(result))
volInfo = result[1].split(',')
outputVol = volInfo[0].replace('output volume:', '')
print(outputVol)
```

The result is `50`.