teleren/devto huggingface dataset:
Uses
Tags: webdev, beginners, productivity, tools
Published: 2020-03-03 14:10:09

---
title: Uses
published: true
description: There are times when I am asked what software or hardware I am using. This page will serve as a living document.
series: Not Code
tags: WebDev, Beginners, Productivity, Tools
---

There are times when I am asked what software or hardware I am using. This page will serve as a living document.

## Physical

* Calendar: [Ink and Volt](https://inkandvolt.com/)
* Quiver for pens: [LINK](https://inkandvolt.com/product/quiver-pen-holder/)

## Hardware

* Work Laptop
 * MacBook Pro (15-inch, 2018), 2.6 GHz Intel Core i7, 16 GB 2400 MHz DDR, Radeon Pro 560X 4 GB Intel UHD Graphics 630 1536 MB

* Mechanical Keyboard
 * [V-Technology Mechanical Gaming Keyboard](https://www.amazon.com/gp/product/B073XFDPNF/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1), blue switches

## Editor

* [Visual Studio Code](https://code.visualstudio.com/) is my code editor of choice.
 * Dark+ Theme.
 * [Live Share](https://code.visualstudio.com/blogs/2017/11/15/live-share) for pairing.
 * [GitLens](https://github.com/eamodio/vscode-gitlens) simply helps you better understand code. Quickly glimpse into whom, why, and when a line or code block was changed. Jump back through history to gain further insights as to how and why the code evolved.

## Software

* [Jolt of Caffeine](https://apps.apple.com/us/app/jolt-of-caffeine/id1437130425?mt=12): this is software I use to keep the Mac awake when presenting.
* [200 OK! Web Server for Chrome](https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?hl=en): this is a handy little Chrome App that lets me prototype small sites.
* [Multi Monitor Wallpaper](https://apps.apple.com/us/app/multi-monitor-wallpaper/id504284434?mt=12): this app allows me to define wallpaper that spans several screens. There is a minimal cost for this software that is worth it.

## Sites

* [Flaticon](https://www.flaticon.com/): great simple graphics, most free with attribution.

## Books

### Programming

* [Clean Code](https://www.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882/ref=sr_1_3?keywords=clean+code&qid=1564669002&s=gateway&sr=8-3), Robert C. Martin
* [Working Effectively With Legacy Code](https://www.amazon.com/Working-Effectively-Legacy-Michael-Feathers/dp/0131177052/ref=sr_1_2?crid=3MQAE9HXNYM7R&keywords=working+effectively+with+legacy+code&qid=1564669139&s=gateway&sprefix=legacy+cide%2Caps%2C462&sr=8-2), Michael Feathers

### JavaScript

* [The Principles of Object-Oriented JavaScript](https://www.amazon.com/gp/product/B00I87B1H8/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1), Nicholas C. Zakas
* [Testable JavaScript](https://www.amazon.com/gp/product/1449323391/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1), Mark Ethan Trostler

### Cascading Style Sheets (CSS)

* [CSS Secrets: Better Solutions to Everyday Web Design Problems](https://www.amazon.com/gp/product/1449372635/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1), Lea Verou
Algorithms and Data Structures: Linear Search
Tags: python, tutorial, career, beginners
Published: 2020-03-03 14:03:14

As the name says a linear search is a process that starts at the beginning of a list and goes through every element (one item at a time) until it finds the element which is looking for. To find the element which is searching for (for example we are searching for ``x``), a linear search algorithm is comparing every element in the list with the value inside of ``x``, until a match is found or the whole list has been searched. Performance for using linear search in large lists is bad because it makes at most n comparisons, where n is the length of the list. In practice, linear search algorithm is rarely being used because other search algorithms like the binary search algorithm allow significantly faster searching for all but shortlists.

[**Continue reading...**](https://www.codespot.org/algorithms-and-data-structures-linear-search/)
Deploying Grails 4 to Heroku
Tags: grails, heroku, groovy, java
Published: 2020-03-03 13:58:50

[Heroku](https://www.heroku.com/) is a PaaS(Platform as a Service) for running web apps that makes it as simple as a git push to deploy. They offer a free tier that is great for demos or quick testing environments and services such as redis, postgres, and many others. 

There are a few minor changes from the default heroku gradle build pack to get your Grails 4 app run.

By default `heroku` will run the task `stage` to get your app ready. You could add a gradle task named `stage` or change the default task by running:

`$ heroku config:set GRADLE_TASK="assemble"`

The `Procfile` is used to tell `heroku` how to start your app, in this case, we need to pass the dynamically assigned port to our app, along with heroku's JAVA_OPTS. Lastly, tell it where gradle put our war/jar.

`Procfile`

```
web: java -Dserver.port=$PORT $JAVA_OPTS -jar build/libs/*.war
```

If you'd like to run on OpenJDK 11 - create a `system.properties` file with the following: 

`system.properties`

```
java.runtime.version=11
```

And thats it. Push to Heroku and your app will build and deploy in about a minute.

```
$ git push heroku master
Enumerating objects: 3, done.
Counting objects: 100% (3/3), done.
Delta compression using up to 8 threads
Compressing objects: 100% (2/2), done.
Writing objects: 100% (2/2), 227 bytes | 227.00 KiB/s, done.
Total 2 (delta 1), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Gradle app detected
remote: -----> Installing JDK 11... done
remote: -----> Building Gradle app...
remote: -----> executing ./gradlew assemble
remote:        > Task :compileJava NO-SOURCE
remote:        > Task :compileGroovy
remote:        > Task :buildProperties
remote:        > Task :processResources
remote:        > Task :classes
remote:        > Task :compileGsonViews
remote:        > Task :findMainClass
remote:        > Task :bootWar
remote:        > Task :war SKIPPED
remote:        > Task :assemble
remote:
remote:        BUILD SUCCESSFUL in 25s
remote:        6 actionable tasks: 6 executed
remote: -----> Discovering process types
remote:        Procfile declares types -> (none)
remote:
remote: -----> Compressing...
remote:        Done: 117.2M
remote: -----> Launching...
remote:        Released v21
remote:        https://my-app.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/my-app.git
   905744b..b239ff4  master -> master
```

See also:
https://devcenter.heroku.com/categories/java-support
https://devcenter.heroku.com/articles/deploying-gradle-apps-on-heroku
How to make your potential customer buy your product
Published: 2020-03-03 13:46:59

As a trader, you provide different types of products and services. They are of perfect quality. So why don’t your potential costumers do the final step? The answer is so simple. There is a wide range of companies that offer the same product. You should make your product unique and different. There are some steps you should take into consideration to make the potential customer prefer your product from the others.
Represent your products and services properly.
Sometimes you lost costumers only because they don’t know much about your product. People prefer products that are familiar with. You should make your brand known through the internet. Show pictures of your products or services. Take good photos. If there is a need, hire a professional photographer. Make sure people know about your product. 
Don’t lie to your costumers
People have the right to know everything about the product they want to buy. If you give them invalid information, it means, you will lose a potential buyer. Don’t hide the real prices. People don’t like being cheated. Speak about details that will help them make a proper decision. 
Act on emotions
What influence our decision making process most of all? Of course, our emotions. While presenting your product, emphasize the positive emotions your product or its purchase will cause. Talk only about the positive side of your product and make sure he/she is impressed. 
To sum up, making potential customers into your faithful customers is not something easy. Though if you use the tips that I mentioned above you will be positively shocked with the results. Make your product known among the others. Be sincere towards your clients and it will be mutual. Give and you will get the positivity.
How to find the script that changes a html tag's attribute
Tags: javascript, html
Published: 2020-03-03 13:34:37

Sometimes you have the luck that you must work on a project that is quite old an contains alot of scripts. Then, one day you are developing (or debugging) and you noticed that a certain html tag's attribute changed. You know that this is done by a script since that attribute does not have that value when viewing the source or when you look at what the backend renders. The next step is then obviously to find that script (and code line) so you can understand why it happens and, if needed fix it.

The most obvious way to find that script is to set a breakpoint the moment that attribute changed. The thing is, you can't set a breakpoint without knowing the javascript file and line number. _Or can you??_

As I found out recently, chrome's dev tools can actually set a breakpoint on the moment an attribute changes.

#How to do it
To get straight to the point, you can you can right click on a html node and choose _break on_ and then pick _attribute modifications_ like this:

![Enabling attribute modifications](https://dev-to-uploads.s3.amazonaws.com/i/qk3a2d1tje3d79w4ac45.png)

Chrome will add a blue dot left of the html tag:
![A breakpoint on an attribute modifications](https://dev-to-uploads.s3.amazonaws.com/i/60pukvqoq16mw95nl3r1.png)

Then, as soon as __an attribute__ changes, the code will stop executing on the line that does the attribute changes

#Additional tips
Since there are different ways in javascript to change an attribute (E.g. using jQuery, an additional js file,...) you might not end up on the code location you need to be. But on the right side of your dev tools you can see the stack trace. There you can see which function and file called the code you are currently breaking on.
How to share and change state between components using props
Tags: javascript, react, reactnative
Published: 2020-03-03 13:32:20

I have stuck at the point, where I want to get the state of toggle button in child component and also change that state from another child component, so I came up with the solution:

# 1. In your higher-order component initialize the state and the toggleHandler like below:

```javascript
this.state = {
  headerToggle: true
}
```

```javascript
toggleHeader = () => {
  console.log("TOGGLE HEADER >", this.state.headerToggle)
  if (this.state.headerToggle) this.setState({ headerToggle: false});
  if (!this.state.headerToggle) this.setState({ headerToggle: true})
}
```

# 2. pass the state and toggleHandler as props to a child component

```javascript
<Header headerToggleHandler={this.toggleHeader} headerToggle={this.state.headerToggle} />
<BodyComp headerToggle={this.state.headerToggle} />
```

# 3. get the props in a child component 

```javascript
const { headerToggleHandler, headerToggle } = props;
```

# 4. toggling the state from child component

```javascript
<IconButton onClick={handleDrawerToggle}>
  Menu toggle {headerToggle}
</IconButton>
```

```javascript
const handleDrawerToggle = () => {
  headerToggleHandler();
};
```
Realistic Challenges Faced for Implementing DevOps in an Organization
Tags: devops
Published: 2020-03-03 13:30:24

Many software development organizations around the world use traditional software development methods, which involve various stages throughout its completion. The organizations can change the development process to automate it using software. DevOps is the software that automates software delivery by concurrently facilitating the software development and testing phases, between the software developers and information technology teams. https://www.addwebsolution.com/blog/realistic-challenges-faced-implementing-devops-organization
My flutter app's state is not transitioning.
Tags: help
Published: 2020-03-03 13:14:51

I'm developing a Flutter app and I faced the next problem: My application state's is not transitioning like I would like.

The BLoC manage the behaviour of a form with properties of a Person Model.

So my state class looks like this.

class SynchronizedForm extends Equatable {

  final PersonModel savedModel;

  final PersonModel actualModel;

  SynchronizedForm(this.savedModel, this.actualModel);

} 
Note: The PersonModel also extends Equatable.

I've added a Simple Delegate to the BLoC, just for me to know what is exactly happening during the application run.

The delegate print on all state transitions.

The properties of the actualModel are updated via Events (BLoC pattern).

class PersonBloc extends Bloc<PersonEvent, PersonState> {

  PersonModel person;

  PersonBloc (PersonModel person);

  @override
  PersonState get initialState => SynchronizedForm (person, person.copyWith());

  @override
  Stream<PersonState> mapEventToState(
    PersonEvent event) async* {

    if (event is ModifyPerson)
      yield* _modifyPerson();

    else if ...
  }

  Stream<PersonState> _modifyPerson(
    ModifyPerson event) async* {

    PersonModel actual = state.actualModel;

    actual.prop = event.value;

    yield SynchronizedForm (
       state.savedModel,
       actual);
   }
}
So the main problem is that I have widgets in my screens that consumes this state changes, but when the actual state is SynchronizedForm and I modify the person I'm again returning a SynchronizedForm. There's no explicit transition here but I need one to.

I tryied without Equatable, with Equatable. Using BlocConsumer, BlocListener (all this from flutter_bloc package). I don't know what more to do.

I hope you understand what I'm trying to do. Thank you all!
How to thrive as a freelance developer in 2020
Tags: freelance, freelancedev, javascript, freelancer
Published: 2020-03-03 13:08:23

Hey, folk devs! I recently interviewed Matt Inglot, host of the Freelance Transformation Podcast, and wanted to share some of the tips he gave me on how to kill it as a freelance dev in 2020! 

1- Leverage the learning resources available online, and connectivity tools such as Dropbox, Zoom, Calendly. 
(These tools make it easier than ever before to succeed as a freelancer developer.)

2- Figure out the skills you have which are most likely to create value for your clients and define your ideal client.

You should do the exercise of relating your current skillset with the potential business value that it can create. Let's say you're into modern frontend frameworks such as Gatsby.JS. Gatsby sites are:

- Light-speed fast => Lower bounce rates

- Good SEO => Better organic outreach

From this added business value, you could then define an ideal client.  In our example, the ideal client could be business owners with a sluggish WordPress site. 

3- Connect and speak with as many business owners as possible (online and offline)

Time to connect! Ideally, these business owners should fit the ideal client you have already defined. 

4- Use value-pricing rather than hourly rates. 

Business owners usually feel safer talking in terms of the total project budget rather than your hourly rate. Value-pricing is :
a) More lucrative 
b) More likely to be accepted by your client.

5- Focus on client relationships and apply the 80/20 principle to your client base.  

Rather than focusing on showing off your skills, focus on the value you can add to your clients and being professional with them. 
 
Also, choose high-value clients and make sure you run your work in a way that creates freedom for you rather than taking it away.

6- Don't cut corners. The tried and true way to start takes work and being consistent. At the same time,  you don't need to get too fancy (logos, company names, fancy websites) to get started.


The full interview (with many more top insights): https://thefreelancechoice.com/casestudies/how-to-thrive-as-a-freelancer-in-2020-with-matt-inglot

Weekly interviews with top freelancers, and subscribing for updates: https://thefreelancechoice.com/casestudies
Daily Developer Jokes - Tuesday, Mar 3, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-03-03 13:00:18

---
title: "Daily Developer Jokes - Tuesday, Mar 3, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Tuesday%2C%20Mar%203%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1259ae4191d.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q___: Why did the developer cancel their dinner plans?

___A___: They were unable to fulfil peer dependencies
 -->
Nevertheless, Gabi Coded
Tags: wecoded
Published: 2020-03-03 12:56:37

---
title: Nevertheless, Gabi Coded 
published: true
tags: shecoded
---
<!-- ✨This template is only meant to get your ideas going, so please feel free to write your own title & narrative! ✨ -->

<b>Equality in tech looks like</b>
Everyone should have a place at the table. The common ground from my point of view is composed of respect, kindness and openness to learn and adapt.

<b>I’m an expert at</b>
I have a bit over a decade of experience working with Java, SpringBoot, native Android, JavaScript and React.js (as of lately). I learn by doing mostly and I am often looking to learn new stuff, became a better software developer and always trying to be a better human. I love creating products that are used by as many people as possible, hoping to bring value to their time and make a task or more simpler. I enjoy working in a team, especially if the team is not mean to me or others that are not exactly like them.
I am mostly looking to collaborate with sustainable businesses and to keep a balance of work and life.

<b>My advice for allies to support self-identifying women and non-binary folks who code is</b>
Be a decent human being, and give platform to people that have less or almost none. Try to keep your own ideas of what other people's life and choices should be. Be concern only with the collaboration, communication, work and how you conduct yourself. Decent people will reciprocate this and give more.

We are highly productive and happy when we feel safe at work, our work is recognize in the same way other's work is, we are payed as others are in our own level, we are offered opportunities without discussing our family situation or other personal things you might see as an impediment in our career. We want to own our career as well as we do our life.


<!-- Once your post is published, it will not appear on the /t/shecoded page until an admin approves it. This is an extra step to ensure there is no abuse on this important tag. -->
Think Like A Coder- Animated Programming Basics
Tags: learn, animated
Published: 2020-03-03 12:48:30

Thought I would share this interesting series by Ted-Ed called "Think Like A Coder", which is an animated series on basic programming concepts explained through the art of story telling! I found this on YouTube, and it is quite fascinating!

https://www.youtube.com/playlist?list=PLJicmE8fK0EgogMqDYMgcADT1j5b911or
🔥 How to merge a pull request
Tags: github, git, repository, gitlab
Published: 2020-03-03 12:48:25

---
title: 🔥 How to merge a pull request
published: true
description: Rules to take into consideration when merging a pull request
tags: github, git, repository, gitlab
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xkyk0ltcq7lt2mv5jweb.jpg
series: git
---

There are some rules that are best to follow when merging a pull request.

When merging a pull request, GitHub offers 3 options:

- `Create a merge commit`
- `Squash and merge`
- `Rebase and merge`

We should use each of them depending of the situation:

- If PR has only one commit and commit explains well what was done use `Rebase and merge`
- If PR has only one commit but commit does not explain exactly what was done use `Squash and merge` and add commit name that will explain more exactly what was done
- If PR has more commits but they are intermediary (ex: fix style, add object, remove test ) also use `Squash and merge` and add a commit name that will group all commits in one
- If PR has more commits but every commit has an explicit title what has been done, each commit is a single unit, then use `Create a merge commit` so each commit will be visible in default branch


If you want to read more about how to write correct commit messages, follow the link https://conventionalcommits.org

Cover Photo by <a href="https://unsplash.com/@pinewatt?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">pine  watt</a> on <a href="https://unsplash.com/s/photos/merge?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
What is your everything files or folders naming convention ?
Tags: discuss
Published: 2020-03-03 12:46:13

---
title: What is your everything files or folders naming convention ?
published: true
description: naming convention
tags: discuss
---

Hi,

I'd like to know what is your files and folders naming convention if you have one ? 

`hello_world.ext`
`hello-world.ext`
`hello.world.ext` ...

Can you explain your preference in the way to fit best to that data programming world we are living in ?

Thanks
OverTheWire Bandit Level 4 Level 5 walk-through
Tags: security, infosec, ctf, beginners
Published: 2020-03-03 12:27:09

Challenge page => https://overthewire.org/wargames/bandit/bandit5.html

This time, we try to read the password from the "only human-readable file in the inhere directory."

Read that part in the quotes twice. By now, you should be used to the fact that there is a subtle hint in here, and among the list of commands you may need

> ls, cd, cat, file, du, find

Now, lets take a look at the contents of the directory to see what all the fuss is about, and try reading a file or two

![Contents of inhere directory](https://dev-to-uploads.s3.amazonaws.com/i/xtwl7oqoj1ymukf1yayh.png)

Ha! That's why they mentioned "human-readable"! The files seem to contain binary data, which cannot be read by programs(cat etc) designed to read text files.

So, we can either go through all of them one by one to see which one has text, or we find an easier way to filter out the one file among the 10 that contains text

___
Hint 1: Try and figure out which of the "commands you may need" listed earlier can be used here to solve our problem. Try reading their man pages. :)
___




This one's quite obvious eh? 

The `file` type comes in very handy in such situations. Let's go ahead and run it on the entire directory to figure out which file has the password.


![Check file type and display password](https://dev-to-uploads.s3.amazonaws.com/i/1a7vupy4seh2jo2thkfi.png)


Aaand there we have it. Onto the next challenge!