teleren/devto huggingface dataset:
Connecting two remote repositores to a single project
Tags: git, heroku, github
Published: 2020-04-27 00:30:58

---
title: Connecting two remote repositores to a single project
published: true
description: Sometimes you need to store your project in multiple remote locations. In this guide I'll walk you through how to set-up and use those.
tags: git, heroku, github
---

I have a project I'm working on which will be deployed to heroku, however I would also like to keep a copy on github since that's my primary portfolio storage. It's simpler than you would think. Without further ado, let's get to it.

Here's what needs to happen to get multiple remote repositores.
1. Create your local git file.
2. Create your remote repositories.
3. Create git path which pushes to both.

-----
1. Creating a local git file is easy. <code>cd</code> into where you want your git file to live. Run <code>git init</code> to create an empty local git.

2. For github here are <a href="https://help.github.com/en/enterprise/2.14/user/articles/creating-a-new-repository">instructions to create a new github repository</a>. Once, your github repository has been created you can connect it to your project with <code>git remote add github your-github-repository-URL</code>. This will create a connection named github to your github repository located at your-github-repository-URL. Feel free to use a different name than github for your connection, but in this guide that will be the name I use for future commands.
<br><br>
For heroku, if you don't have an account you can read my guide on connecting a heroku account to a project <a href="https://dev.to/lughjw/deploying-to-heroku-1c3p">here</a>. Otherwise, if you do have a heroku account and heroku CLI, in the same directory as your .git folder in your terminal you can enter <code>heroku create</code> to create a remote repository and link your project in one step.

3. Now that you have two separate channels to push to, lets make a joint path. We'll create a new remote path named 'all' and initialize it with the github repository. You can choose either one as your primary, but I prefer github since it takes less time to upload to. So to add a path we do what we did before.
```bsh
$ git remote add all your-github-repository-URL
$ git remote set-url --add --push all your-github-repository-URL
$ git remote set-url --add --push all your-heroku-git-repository-URL
```
You can verify it by entering <code>git remote -v</code> which will print out the paths in git directory. Now all you have to do to push to both repositories is 
```bsh
$ git add .
$ git commit -m "make your change comments here"
$ git push all
```
"function take an argument" (PYTHON3)
Tags: python, codenewbie, motivation
Published: 2020-04-27 00:23:03

When a function take an argument my intentions are clear :)



def say_it_loud(word):
    print(word + "!")

say_it_loud("GET BETTER")
say_it_loud("KEEP CODING")
say_it_loud("HACKING HOLLYWOOD")

GET BETTER!
KEEP CODING!
HACKING HOLLYWOOD!
Premium Laravel courses and books
Published: 2020-05-02 16:07:03

---
title: Premium Laravel courses and books
published: true
date: 2020-04-27 00:00:00 UTC
tags: 
canonical_url: https://martinbetz.eu/articles/premium-laravel
---

There are many premium paid video courses (📺) and books (📘) for Laravel.  
I also list content that is not released yet (🚧).  
The list is sorted alphabetically:

- 📺 [Build A Chatbot](https://course.buildachatbot.io/)
- 📘 [Build an API with Laravel](https://buildanapi.com/) 
- 📺 [Confident Laravel](https://confidentlaravel.com/) (📺)
- 📺, 🚧 [Eloquent Performance Patterns](https://eloquent-course.reinink.ca/)
- 📺, 🚧 [In Depth Laravel](https://indepthlaravel.com/)
- 📺 [Laravel Core Adventures](https://laravelcoreadventures.com/)
- 📘, 🚧 [Laravel Secrets](https://laravelsecrets.com/)
- 📘 [Laravel Up & Running](https://laravelupandrunning.com/)
- 📺, 🚧 [Multi Tenancy with Laravel](https://multitenancy.dev/)
- 📺 [Online Courses by Laravel Daily](https://laraveldaily.teachable.com/) 📺
- 📺 [PHP Package Development](https://phppackagedevelopment.com/)
- 📘 [Refactoring to Collections](https://adamwathan.me/refactoring-to-collections/)
- 📺 [Serverless Laravel](https://serverlesslaravelcourse.com/)
- 📺 [Test Driven Laravel](https://course.testdrivenlaravel.com/)

If you know more resources, please email me 👇.
CSS and Spacing 📏
Tags: css, html, webdev, todayilearned
Published: 2020-04-28 14:56:52

---
title: CSS and Spacing 📏
published: true
date: 2020-04-27 00:00:00 UTC
tags: css, html, webdev, todayilearned 
canonical_url: https://includejs.dev/css-spacing
---

My notes from the excellent article on [Spacing in CSS](https://ishadeed.com/article/spacing-in-css/) by [@shadeed9](https://twitter.com/shadeed9) 💪.

Spacing can be divided into two groups:

- inner spacing (`padding`)
- outer spacing (`margin`)

## What's a margin collapse?

Margin collapse happens when two vertical elements have a margin, and one of them has a greater margin than the other. In that case, the greater margin will be used, and the other will be ignored.

🔨 To fix: Use a single direction margin, e.g.:

```
.element:not(:last-child) {
    margin-bottom: 1rem;
}
```

🤔 If both the parent and the child have a margin, the child's margin will be collapsed.

🔨To fix:

- Add a `border` to the parent element OR
- Change the child element `display` to `inline-block` OR
- Add `padding-top` to the parent element.

## Padding is not working

Vertical padding doesn’t work with elements that have display: inline, like `<span>` or `<a>`.

🔨 To fix: need to do `display: inline-block;`

## RTL Styling

Learn about [Right to Left styling](https://rtlstyling.com/posts/rtl-styling#introduction-to-rtl-styling).

## Gaps in Flexbox layout

Flexbox doesn't have a gap property, like `grid-gap`.

🔨 to fix:

- Add `padding-left` to the grid item AND
- Add a negative `margin-left` with the same padding-left value to the grid parent.

The reason: because the first card has padding-left while in reality it’s not needed. So it will push the wrapper to the left and cancel that unneeded space ([Demo](https://codepen.io/shadeed/pen/b4abf0f83804991925de43367562d93f?editors=1100)).

## Margin bottom

The last element should not have a bottom margin, as margin should only be between elements.

🔨 To fix: cancel the unneeded spacing by adding a negative margin to the parent element.

## `vmin`

Viewport Minimum (vmin) – A percentage of the viewport width or height, whichever is smaller. 10vmin will resolve to 10% of the current viewport width in portrait orientations, and 10% of the viewport height on landscape orientations.

## `vmax`

Viewport Maximum (vmax) – A percentage of the viewport width or height, whichever is larger. 10vmax will resolve to 10% of the current viewport height in portrait orientations, and 10% of the viewport width on landscape orientations

- `grid-gap: min(2vmax, 32px);`

Use a gap equal to 2vmax, but it shouldn’t go above 32px.
Would you ever go back to Angular from React?
Tags: discuss, react, angular
Published: 2020-04-26 23:56:28

I'm not trying to start a holy war!
I can remember a few years ago while having only theoretical knowledge on React, I had lots of discussions about the pros and cons of React vs Angular2.
Now after using React for about 2 years, I can't imagine any reason ever to use Anguar2. Unfortunately, occasionally I have to and it's a pain.

So, what I'm trying to find out, did I've got too obsessed with React? or it's really that much superior over Angular (and I assume others too, except preact)
Portal progress, still a long way to go!
Tags: twiliohackathon, mexico
Published: 2020-04-26 23:21:24

Today i was able to make good progress on the portal side. I created a portal for adding COVID-19 patients, family members and the skeleton for my patient search.

The stress is killing me and i need time off from this project. But tomorrow i will resume my activities and hopefully start working on the back-end,

![Portal](https://dev-to-uploads.s3.amazonaws.com/i/3pfs2m81waf18o8wy079.PNG)
![Portal](https://dev-to-uploads.s3.amazonaws.com/i/mjq8lka5vhk8013ww5n0.PNG)
![Portal](https://dev-to-uploads.s3.amazonaws.com/i/a1on0djjuaty48u8h72f.PNG)
Repo
https://github.com/markwinap/Twilio-Hackathon-COVID-19-Communications
Sharing your project folder with Windows and WSL
Tags: wsl, linux, windows
Published: 2020-04-26 22:32:53

This is going to be short and sweet since it's not that complicated. The main goal is to operate in the same project folders whether you are operating within WSL or Windows itself. The side bonus is it's easier to keep your project folder backed up. 

First thing, when I say project folder, what I am referring to is one folder I call `Projects` and I keep everything I'm working on in there. I do a lot of stuff that doesn't necessarily require me to be in the Linux Subsystem all the time, but I like to always work out of one directory whichever interface I'm in. 

First off you need to make your `Projects` folder or whatever you would like to call it. Again, I like "Projects". I place it in my Windows user folder. It's a little more difficult navigating from within Windows to the subsystem. But from the subsystem to Windows is no problem. And there are some other benefits to keeping it on the Windows side. 

Unless you have changed it, WSL usually defaults you to your Windows home directory instead of the Linux user directory. 

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

So the first think we want to do is document that path..in mine it's `/mnt/c/Users/timap` we're just going to add our Projects folder to that path assuming you created it in your Windows Home. So, mine would be `/mnt/c/Users/timap/Projects`.

So what I do next is make an alias to my path in my .bashrc or .zshrc depending on which shell your using. The steps are the same. 

`cd` - Brings me to my Linux home Directory.
`nano .zshrc` - Will open up my zsh config in the nano editor. You could also do `nano .bashrc` again if that was your shell of choice. 

What I am going to do is goto the bottom of my config and create an alias, in my case using the work "projects" and I am going to have it point to that Windows home projects folder. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6nwsqnjrmzrtskbwf67p.PNG)

Then just `ctrl + o` to save and `ctrl + x` to exit. To reload your config you can just `source .zshrc` or `source .bashrc` depending on which one you were using. 

So looking at the alias I made, now whenever I am in my Linux terminal I just type `proj` and bam! There I am. Also, when in a directory while using the subsystem you can type `code .` and it will open Visual Studio Code using that directory as a working directory. 

So here are the two ways I work.
1. I open VSCode and navigate to my project folder the old-fashioned way through Windows and get to work, but no access to the subsytem. 
2. I open up my Ubuntu install, type `proj`, the type `code .` and I'm doing the same as above but working through Linux. 

The secondary benefit is I now sync that directory with [pCloud](https://pcloud.com). So I always have it backed up outside of just using git. Of course, it being Windows you could throw your projects folder in your Onedrive and accomplish the same effect.
A refreshing development experience awaits...
Tags: opensource, microservices, javascript, distributedsystems
Published: 2020-04-26 22:20:12

## The developer-entrepreneur’s dilemma:

Application development is slow, it’s inefficient, there’s high overhead, customization & maintenance are a mess, it’s hard to scale, tough to secure, a challenge to avoid vendor lock-in, and you’re dependent on the success of the platforms you build upon.

*That’s all about to change...*

## Coming soon: a new light platform built atop MESG.

Streamline your development experience, launch high-quality projects faster, keep the ownership in your hands, and run applications without managing anything.

*And that's just the beginning.*

[Register here](https://liteflow.com/?utm_source=devto&utm_medium=blog_post&utm_campaign=teaser) to be among the first to access the new platform. And follow us on Twitter so you don't miss a beat.
Comparing 3 java build tools (Ant vs Maven vs Gradle)
Tags: java
Published: 2020-04-26 22:06:47

---
title: Comparing 3 java build tools (Ant vs Maven vs Gradle)
published: true
description: We will compare java build tools.  By comparing Ant vs Maven and Maven vs Gradle we will figure out if Gradle or Maven will be the best tool to use. Ant is the old build tool that is not used much but is still good to know about.
tags: java
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/t6ccaa7crqodldk7args.jpg
---

{% youtube s6W2R1Z3wd4 %}

We will compare java build tools.  By comparing Ant vs Maven and Maven vs Gradle we will figure out if Gradle or Maven will be the best tool to use. Ant is the old build tool that is not used much but is still good to know about.
BeTheHope - Let's Campaign [2]
Tags: twiliohackathon, donation, twilio, campaigns
Published: 2020-04-26 21:53:45

Happy Sunday! I hope you had a chance to go over my previous [post](https://dev.to/abhinavchawla13/bethehope-first-glimpse-1-29ei), and it gave you an idea of how easy the donation process can be for donors.

In this post, I will give an overview of how Small Business Owners (SBOs), Charities and NGOs can leverage the **BeTheHope admin portal** to create campaigns, and share the short URLs and QR codes with the public.


###So, what is a campaign?
The dictionary definition of campaign is, *"work in an organized and active way toward a particular goal"*. Now, let me walk you through what a campaign means in this application. A campaign is a customized donation link. For instance, any organization can create a campaign for the education of underprivileged children in Canada. Simply put, **the cause is the campaign**.

The screenshot below gives us an overview of the campaigns created by the organization *'Care Canada'*. The selected campaign has the campaign code *'summer'*, and it shows the URL and QR code which can easily be shared by the organization. This provides a convenient way for users to donate as we saw in the short [video demo](https://www.youtube.com/watch?v=y_fr0XbOyiE) in the last post. Next to the campaign code, we see more information about the campaign such as the description, date of creation, and most importantly the donations collected to date.

It’s fairly easy to create a new campaign by clicking the *‘Create’* button on the top-right corner and filling out a couple of fields (which I’ll cover in a walkthrough video soon).

![Campaigns view](https://i.imgur.com/WbTY2P5.png)

---
###Sweet, how can I share it?
\*drumroll\*.. \*drumroll\*.. 
Answer is **Twilio**. 

The dashboard has a *'Reach People'* page which provides users the ability to add any campaign code they created before, list out phone numbers or emails and add a custom message. They can share it with others via text messages, emails or WhatsApp (or even better: all of them 😁). 

![Reach People view](https://i.imgur.com/83VREAA.png)

And here’s a sample of the text, email and WhatsApp message you will receive respectively. The URL will take you to the same convenient donation page that you saw in the demo.

![Notification Reached view](https://i.imgur.com/lGqImAN.jpg)

---

###... and what should I do with the QR Code?
Share it via social media or add it to pamphlets, business cards and t-shirts! Leave no stones unturned to make your campaign as noticeable as possible!

---

My aim with this project is to make the donation process easier for both the donor and the donee. I’m glad that my vision is finally translating into reality and I will keep you posted on new updates. Till then, stay home and stay safe!
Pro console methods in Javascript
Tags: javascript
Published: 2020-04-26 21:50:50

[![Image from Gyazo](https://i.gyazo.com/7f519448106d47bc1ace90aa4254bcc1.png)](https://gyazo.com/7f519448106d47bc1ace90aa4254bcc1)

If you use javascript, you are probably familiar with the console object and the classic method **console.log()**. Undoubtedly at some point, your project has been littered with these logs helping you track your bread crumbs leading you to the error you so desperately wanted to fix. Let's take a look at some other things you can do with the console.

##console.table()

[![Image from Gyazo](https://i.gyazo.com/427b312fa4731b3b73775e6c927d058e.png)](https://gyazo.com/427b312fa4731b3b73775e6c927d058e)

Pretty snazzy, right? This method prints a table for the object that you log.

##console.dir()

[![Image from Gyazo](https://i.gyazo.com/44dd3af5ce1cdcd9e3a51c6a36a6206a.png)](https://gyazo.com/44dd3af5ce1cdcd9e3a51c6a36a6206a)

This displays an interactive list of the properties of the specified JavaScript object. Works well when working with html elements. 

##console.time() and console.timeEnd()

[![Image from Gyazo](https://i.gyazo.com/016349531041cfd58319c73b6cad5b67.png)](https://gyazo.com/016349531041cfd58319c73b6cad5b67)

If you think there's a performance issue in your program, this is a neat way to test your theories. 

##console.count()

[![Image from Gyazo](https://i.gyazo.com/d145efad743b3ccce33224e09f2bcd21.png)](https://gyazo.com/d145efad743b3ccce33224e09f2bcd21)

This will help you count the amount of times your code has been read. 

##console.clear()
[![Image from Gyazo](https://i.gyazo.com/8aeaf88e5172caeeb769fdb0c18ebe58.png)](https://gyazo.com/8aeaf88e5172caeeb769fdb0c18ebe58)

This one should be obvious...
Pokedex: Gotta Search'em All
Tags: showdev, react, opensource, typescript
Published: 2020-04-26 21:13:26

I recently built out an interactive Pokedex to mimic what Pokemon Trainers would use :). This was such a fun project, I wanted to share with y'all!

# Gotta Search'em All🔍

https://gotta-search-em-all.netlify.app/

## repo 

https://github.com/shimphillip/gotta-search-em-all

## Contributing

Feel free to contribute via Issues/PRs.
Design Patterns, good habits and good sense!
Tags: development
Published: 2020-04-26 21:11:09

This week we made a recording on the Café debug podcast about Design Patterns, good habits and good sense. The podcast is in Portuguese, but I dcided to write our conversation in English, of course just a summary.

Let's start with Clean Code. The book Clean Code for some people is considered the Bible of developers, because it teaches some techniques to make yours code cleaner and more inteligible.

But, why do we need to wirte code? Let´s see.
- Because we want to deliver results faster;
- The requirements were changed during development;
- The code was bad and a given situation´s refactor is not a good idea;

And what changes in a programmer´s life when you write clean code?

- Evolution as a developer: you make your code cleaner, to improve your skill;
- Produtivity increase: the team can have a produtivity increase and fast delivery;
- Clean, cohesive code: a code that everyone can understand where everyone talks the same "language" fallowing an standard;
- Reduce bugs: of course, the quantity of bugs redeced in your code the project and you have less time for correction.

Let's see some good practices that can be applied to clean code.

#Meaningful Name

Your method, class or variables need to have meaningful names. It's not important if your code name is long, but the name needs to be specific according to its functionality.

#Comments are not very good!

You cannot put comments in your code, I think it depends on the situation. Normally we can put comments when we are talking about the code version, or business roles or something specific. So, avoid comments in code.

#Make your code elegant

Try to make your code more elegant, write very well, think about someone that will read your code.

#Last but not least: you need to test your code!

Unit testing is important, very important and you know this. Unit testing prevents future bugs in your project, and tests will teach you if you're learning.
But why don't we test it? Let's look at some reasons why some developers don't test their code.
 
- A small amount of people understand that unit testing is very important
- Don't know how to test your code
- Short deadlines
- The project is not prepared to implement unit tests
- The pressure from the team or manager
- Bad architecture and "code smell" 

So I will leave some links about documentation of the unit test on the Microsoft platform .Net and the documentation of the framework Moq.

1- Best practices for unit testing with .NET Core e .NET Standard
https://docs.microsoft.com/pt-br/dotnet/core/testing/unit-testing-best-practices

2- Framework Moq no Net
https://discoverdot.net/projects/moq

3- Moq documentation
http://www.nudoq.org/#!/Projects/Moq
https://github.com/JessicaNathany/cafedebug

4- Link to technology podcast Café debug
https://soundcloud.com/cafe-de-bug/40-design-patterns-e-boas-praticas-e-bom-senso

5 - Code smell (Martin Fowler) 
https://martinfowler.com/bliki/CodeSmell.html

6 - Refactoring
https://refactoring.com/
A Deep Dive Into Building a Pool Bot
Tags: iot, arduino, azure, c
Published: 2020-04-26 21:00:43

In this multipart series we will take a deep dive into my journey of building an internet connected device that monitors my swimming pool. The data it collects flows through the azure cloud and be accessible on a smart phone running a web browser. I'll also show how I turned that same website into a PWA. 

![Diving In](https://dev-to-uploads.s3.amazonaws.com/i/nxa3wieh1gts56p61332.gif)

What We Will Cover:

- Original Idea / Need
- Hardware
- Sensors
- Making it a Thing on the Internet 
- Back End Services / Data Storage
- User Experience / Front Ends

## Original Idea / Need

I’m Lazy! My pool is outside and I don’t want to have to go out there unless the conditions are ideal for swimming! I want to monitor / control my pool from my phone. Commercial units are really expensive, some are well over $1,000. I bet I can build one for faction of that cost!

### What Should This Pool Bot Do?

Before we jump in, lets talk about what features this bot should have:

- Monitor water temperatures and ground/air temperature.
- Measure the water level in the skimmer to make sure the pump isn't sucking air.
- Turn the Pump on & off to save energy or if the water is low. 
- Measure the filter pressure so I know when to clean it. 
- Measure the Ph and alert me if it needs adjusted. 
- Push data to the cloud, track historic records and be accessible from my phone.

---

Let's dive into [Part 2 and look at the hardware](https://dev.to/j4s0nc/hardware-sensors-a-deep-dive-into-building-a-pool-bot-51fh)
Iterm2 Alternative for Windows
Tags: windows, iterm2
Published: 2020-04-26 19:55:30

For a long time, I used macOS for software development. I used [Iterm2](https://www.iterm2.com/) as my terminal. The most important use case was to split my screen with multiple terminal windows.

But after shifting to windows again, I noticed that, split screen feature isn't available to windows terminal, powershell and git-bash. I started to use git-bash and was looking for other alternatives, which has this split screen feature. After some reseach I found Hyper and Cmder. Among them I liked Hyper more, because of it's interface design and more flexibility.

By default, it will use default termnial, but if you want to use git bash -

1. Download, Install and Open Hyper  ([https://hyper.is/](https://hyper.is/))
2. Press `Ctrl + ,`, a text file will be opened in your default text-editor.
3. Update the value of `shell` by `'C:\\Program Files\\Git\\git-cmd.exe'` and `shellArgs` by `['--command=usr/bin/bash.exe', '-l', '-i']`
c
After that it will look like:

```
shell: 'C:\\Program Files\\Git\\git-cmd.exe',
// for setting shell arguments (i.e. for using interactive shellArgs: `['-i']`)
// by default `['--login']` will be used
shellArgs: ['--command=usr/bin/bash.exe', '-l', '-i'],
```

Now save the configuration and open a new tab(Ctrl+Shift+D).  You will see, new tab opened vertically.

DONE!

Enjoy your terminal!