teleren/devto huggingface dataset:
Dropping the "Master Git and GitHub - Beginner To Expert" course
Tags: showdev, git, github
Published: 2021-04-23 15:23:16

---
title: Dropping the "Master Git and GitHub - Beginner To Expert" course
published: true
description: 
tags: showdev, git, github
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/25vb3w5sjaqxm4zkq1hu.png
---

🚀 Dropping the "Master Git and GitHub - Beginner To Expert" course from today.

✍ I decided to cover all concepts required to contribute to open source projects.

Topics:
- Intro
- What is Git?
- Download and Install Git
- Git Basics
- Git Extensions for VSCode
- What is GitHub?
- Create Account on GitHub
- How To Create a Repository
- How To Push to Repository
- Why Create Issue
- Why Create branches
- Why Create Pull Request
- Review/Approve/Merge a Pull Request
- Why Create Releases
- Git Advance
- Contribute To Open Source Projects
- How To Join an Organization
- How To Create your own Organization
- Working with Private Repositories in Organization
- Files Required within an Open Source Project
- Why use GitHub Bots
- GitHub Contribution Graphs Overview
- Creating Projects
- Creating Gists
- Decorating GitHub Profile
- Final Thoughts

{% youtube YI8rgXo0u24 %}

Playlist: https://lnkd.in/dEqchSH
TDD Practicality
Tags: tdd, programming, discuss
Published: 2021-04-22 05:39:22

### Background
As a young person getting into programming, it's hard not to notice the wildly varying cultural perspectives around the industry. 
From just watching YouTube tutorials, I think I was completely oblivious to the very existence of unit testing for at least a full year after learning the fundamentals of Javascript.

Shortly after, however, I stumbled upon Robert C. Martin (Uncle Bob)'s talks on YouTube. 
If you haven't already seen his six publicly available hour-and-a-half long talks, I highly recommend watching ALL of them. 
I've personally rewatched and listened to them like podcasts in the car at least three times over. 

[Youtube: Clean Code - Uncle Bob](https://youtube.com/playlist?list=PLmmYSbUCWJ4x1GO839azG_BBw8rkh-zOj)

---

### Uncle Bob and TDD
To summarize, he's one of the authors of the Agile Manifesto, a 50+ year software professional, and an extreme advocate for Test Driven Development.

This advocacy for TDD sets him apart from even some of the other people who worked on the Agile Manifesto (which was designed to be a great compromise between wildly different programming philosophies).

---

### My Question
After playing around with TDD in personal projects, I can see its value, and I'm inclined to believe what Uncle Bob says. However, I want to be careful and make sure that I'm not blindly indoctrinating myself into some idealistic nonsense before I have much in the way of real world experience.

I've seen the debates against TDD online, and Uncle Bob himself warns against trying to adopt things like TDD and Agile too quickly, as they're intended to be skills and disciplines that one has to practice to become effective at.

My question is simply this, if anyone would like to share their opinion:

### Why might TDD ever be a bad idea?
   or:
### Why is TDD always a good idea?
NestJS connect to MongoDB
Tags: nestjs, mongodb, javascript
Published: 2021-04-23 15:04:37

TL;DR
- Create database provider by useFactor [here](https://docs.nestjs.com/recipes/mongodb#mongodb-mongoose)
- Create database module import database provider and export
- Create your entity and make own provider by inject database provider [here](https://docs.nestjs.com/recipes/mongodb#model-injection)
- import own provider to use in service

1) Create NestJS application with command line
```shell
nest new ${YOUR_APP_NAME}
cd ${YOUR_APP_NAME}
```

2) Create database folder for collect database connector
```shell
mkdir database
```

3) Make **Database Provider** by use **useFactory**
> useFactory syntax allows for creating providers dynamically

> You can connect multi database source
```typescript
/* 
<project path>/src/database/database.provider.ts
*/

import * as mongoose from 'mongoose';

export const firstDatabaseProvider = {
 provide: '<Provider name>',
 useFactory: async (): Promise<mongoose.Connection> => {
  return await mongoose.createConnection('<MongoDB URI>')
 }
}

export const secondDatabaseProvider = {
 provide: '<Provider name>',
 useFactory: async (): Promise<mongoose.Connection> => {
  return await mongoose.createConnection('<MongoDB URI>')
 }
}
```

4) Make **Database module**
```typescript
/* 
<project path>/src/database/database.module.ts
*/

import * as mongoose from 'mongoose';
import { firstDatabaseProvider, secondDatabaseProvider } from './database.provider';

@Module({
  providers: [firstDatabaseProvider, secondDatabaseProvider],
  exports: [firstDatabaseProvider, secondDatabaseProvider],
})
export class DatabaseModules {}
```

5) Run below command line to create CRUD application by nest-cli
```shell
nest g res ${YOUR_ENTITY}
cd ${YOUR_ENTITY}
```

6) Create entity provider by go to file `${YOUR_ENTITY}.provider.ts`
> You can learn how to create model, mongoose schema and mongoose document in NestJS docs [Here](https://docs.nestjs.com/techniques/mongodb#mongo)

```typescript
import { Connection } from 'mongoose';
import { Entity ,EntitySchema } from './entities/yourEntity';

// use second database
import { secondDatabaseProvider } from '../database/database.provider'

export const myEntityProviders = [
  {
    provide: '<First Entity Provider Name>',
    useFactory: (connection: Connection) => connection.model(Entity.name, EntitySchema),
    inject: [financialDocDBProvider.provide],
  },
]

```

7) make service
```typescript
// ${YOUR_ENTITY}.service.ts

import { Inject, Injectable } from '@nestjs/common';
import { Model } from 'mongoose';
import { myEntityDocument } from './entities/entity.entity';
import { myEntityProviders } from './entity.provider';


@Injectable()
export class EntityService {
  constructor(@Inject(myEntityProviders[0].provide) private entityModel: Model<myEntityDocument>) {}

  async create(): Promise<myEntityDocument> {
    const newObj = new this.entityModel()

    return newObj.save();
  }

  findAll(): Promise<myEntityDocument[]> {
    return this.entityModel.find().exec();
  }
}

```
Two Simple Tricks for Typing Redux Apps with Typescript
Tags: typescript, react, redux
Published: 2021-04-23 14:44:37

Despite having used Typescript and Redux separately for a few years I haven't always had a good experience putting them together. Recently, I stumbled on two tricks that have helped me immensely. 

### Generate Reducer Type from Initial State

When you're creating a new reducer you can use `typeof` to generate the type for the reducer from your initial state. This also encourages us to fully fill out our initial state, which I find helpful for quickly understanding the purpose of each reducer.

When you export your reducer make sure to include that generated type as its return type.

```typescript
const initialState = {
   dogs: 4,
   name: "Callie",
   colors: ["red", "green", "blue"]
};
type MyReducer = typeof initialState;

export default function myReducer(state = initialState, action): MyReducer {
  // ...
}
```

If your initial state doesn't include all of the values, you can include them as placeholder values such as `null`. In those cases you can use `as <type>` to indicate the intended type for that piece of state.

For example `const initialState = { person: null as Person };`

### Export Your Entire Redux State

Once your reducers are all individually typed, you can create and export a combined `ReduxState` type using Typescript's [ReturnType](https://www.typescriptlang.org/docs/handbook/utility-types.html#returntypetype) utility. This type will contain information about every single reducer used in your application. 

```typescript
import { reducers } from "./reducers";
export const store = createStore(combineReducers(reducers));

export type ReduxState = ReturnType<typeof store.getState>;
```

Use this to type the `state` argument used by your selector functions, `mapStateToProps` or anywhere else that may be needed.

```typescript
import { ReduxState } from "../store";

export const getDogs(state: ReduxState) {
   return state.myReducer.dogs;
}
```

---

A version of these same ideas (and many others) can be found in the [Usage with Types](https://redux.js.org/recipes/usage-with-typescript) section of the redux docs.

While it doesn't cover typescript (yet!), don't forget to check out my course [Redux with React Hooks] (https://egghead.io/courses/redux-with-react-hooks-8a37) which shows how much simpler redux becomes when you drop the boilerplate.

What are your favorite typescript tricks when using Redux?
Erro ao executar flutter doctor para adicionar as licenças
Tags: flutter, android
Published: 2021-04-23 14:31:37

Quando tentei executar o comando para adicionar as licenças do **android** necessárias no flutter obtive as seguintes mensagens de erros:

```javascript
wanderson@wande:~/Development/projects$ flutter doctor --android-licenses
Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema
	at com.android.repository.api.SchemaModule$SchemaModuleVersion.<init>(SchemaModule.java:156)
	at com.android.repository.api.SchemaModule.<init>(SchemaModule.java:75)
	at com.android.sdklib.repository.AndroidSdkHandler.<clinit>(AndroidSdkHandler.java:81)
	at com.android.sdklib.tool.sdkmanager.SdkManagerCli.main(SdkManagerCli.java:73)
	at com.android.sdklib.tool.sdkmanager.SdkManagerCli.main(SdkManagerCli.java:48)
Caused by: java.lang.ClassNotFoundException: javax.xml.bind.annotation.XmlSchema
	at java.base/jdk.internal.loader.BuiltinClassLoader.loadClass(BuiltinClassLoader.java:581)
	at java.base/jdk.internal.loader.ClassLoaders$AppClassLoader.loadClass(ClassLoaders.java:178)
	at java.base/java.lang.ClassLoader.loadClass(ClassLoader.java:522)
```
Solução do problema:

* No **Android Studio** acesse **Configure -> SDK Manager**;
* Na janela que apareceu navegue **Appearance & Behavior -> System Settings -> Android SDK -> SDK** Tools e marque a caixa **Android SDK Command-line Tools**; 
* Por fim clique no botão **Apply**;

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y2yjpbabkronw5kmoary.png)
 
Agora ao executar o comando para adicionar as licenças do **android** não ocorrerá os erros listados nessa postagem.

```javascript
flutter doctor --android-licenses
```
React-Router - Video#2
Tags: react, reactrouter
Published: 2021-04-23 14:22:39

The below code base is a supporting article for my youtube reactjs series. [Link](https://youtu.be/_EwvIVsccJs).
My plan for creating the entire video series is listed at the end of this article.

#### Webpack.config.js
```javascript
const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve('dist'),
    filename: 'main.js',
  },
  module: {
    rules: [
      {
        test: /\.js?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
      },
      {
        test: /\.css$/i,
        use: ['style-loader', 'css-loader'],
      },
      {
        test: /\.svg$/i,
        use: [{loader: 'file-loader', options: {esModule: false}}],
      },
    ],
  },
};

```
  
#### App.js

```javascript
import React from 'react';
import {BrowserRouter as Router, Switch, Route, Link} from 'react-router-dom';
import Home from './components/Home';
import Users from './components/Users';

const App = () => {
  return (
    <Router>
      <div>
        <nav>
          <ul>
            <li>
              <Link to="/home">Home</Link>
            </li>

            <li>
              <Link to="/users">Users</Link>
            </li>
          </ul>
        </nav>
      </div>

      <Switch>
        <Route path="/home" component={Home}></Route>
        <Route path="/users" component={Users}></Route>
      </Switch>
    </Router>
  );
};

export default App;
```

#### index.js


```javascript

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));
```




I am planning to create a video tutorial series for ReactJs. Would you be interested ?? Please comment and let me know.

## Following would be the plan 

* Create a basic app with webpack babel. (Done) [Link](https://youtu.be/zVWKtnEm4fk)
* Add routing and get a simple react page ready.(Done) [Link](https://youtu.be/_EwvIVsccJs)
* Adding Sass for css 
* UseFetch Hooks
* Call jsonplaceholder API in the application.
* Input form Validations in react application. 
* Firebase application for CRUD.
* Tomcat deployment for ReactJs.
* Advance Topics....



[Subscribe my channel to watch the videos](https://www.youtube.com/channel/UCajNSAb41SHFYAsCJxUKIMw?sub_confirmation=1) :-)
BigQuery dynamic SQL and managing temp tables
Published: 2021-04-23 14:13:24

Google introduced support for dynamic SQL in BigQuery. Developers working particularly in Oracle must have some liking for EXECUTE IMMEDIATE, the way you execute dynamic SQL queries. Such a feature in BigQuery was missing for a long time, and now that it is here, I can't wait to use it.

### Choosing a problem statement
Let's choose a problem that easily resonates with every developer working with the Google BigQuery world. Who isn't noticing the large volume of temporary tables churned by the client drivers and large datasets. This is particularly true where downstream products implement a version of BigQuery driver and fail to leverage nice features like auto expiration of tables. Not so good part is the hygiene of the dataset, these tables stay forever until explicitly cleared.  What is important for this blog is a problem statement to demonstrate the utility of dynamic SQL.

### Lets address it using Dynamic SQL
Temporary tables do offer the convenience of caching large result sets. With data rapidly changing on BigQuery dataset, let us target the old temporary tables and remove those from the datasets. 

* Our primary goal is to clear all temporary tables older than 24 hours. 
* Achieving this goal needs some more information. We need to identify when a table was created. This is when INFORMATION_SCHEMA of BigQuery is helpful. 
* Last step is that I want this to be scheduled every day, without my intervention. Yes, you can schedule SQL statements using the BigQuery scheduled query feature. 

To clear temporary tables across all datasets, let's write code employing dynamic SQL, iterate all the dataset using the INFORMATION_SCHEMA and delete the temp table using the timestamp and the name starting with temp_table_. And schedule the SQL code using the BigQuery scheduled query option. With this, all the temp tables that are older than 1 day should get automatically cleared at a daily cadence.

{% gist https://gist.github.com/sann3/18987bf36f545dcf6b8c8c85d8ce319f %}
Encapsulation in python
Tags: programming, python, datascience, machinelearning
Published: 2021-04-23 13:44:37

The original detailed article are read here <a href="https://pythonslearning.com/how-to-use-encapsulation-and-data-abstraction-in-python.html">How to use Encapsulation and Data Abstraction In Python</a>
Encapsulation is one of the fundamental concepts in object-oriented programming (OOP). It describes the idea of wrapping data and the methods that work on data within one unit. This puts restrictions on accessing variables and methods directly and can prevent the accidental modification of data. To prevent accidental change, an object’s variable can only be changed by an object’s method. Those types of variables are known as private variable.
Resource :
https://pythonslearning.com/how-to-use-encapsulation-and-data-abstraction-in-python.html
How to Build a Color Wheel with Tints & Shades
Tags: html, css, javascript, webdev
Published: 2021-04-23 13:43:17

I've built a handful of [color pickers](https://dev.to/madsstoumann/colors-are-math-how-they-match-and-how-to-build-a-color-picker-4ei8) through the years, so when I [in this book](https://www.amazon.co.uk/Designers-Dictionary-Colour-Sean-Adams/dp/1419726390/?_encoding=UTF8&pd_rd_w=hVrHi&pf_rd_p=511c9d46-9b08-4a49-8274-fd2b88a7304c&pf_rd_r=YN45PC380BHWB986M602&pd_rd_r=d1d239a3-1b36-4095-b612-0012c7a979ee&pd_rd_wg=iVQvL&ref_=pd_gw_ci_mcx_mr_hp_d) stumbled upon a color-wheel with “built-in” shades and tints, I had to code it:

![Color Wheel with tints and shades](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5j6ufqs46wlhj80x0gnv.jpg)

At first, I thought: “That's easy – it's just a conical gradient with *hard stops* for the colors, and a radial gradient for the tints and shades”.

But, alas, look at how “un-crisp” the edges in the conical gradient are (Chrome, MacOS):

![Color Wheel, using conical gradient](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qhphfx9v83ljaf45d039.png)

So – I had to do it in `<svg>`.

Each “ring” in the circle is built up by 12 circles with different colors and `stroke-dasharray`:

```xml
<g id="wheel">
  <circle class="c3" cx="16" cy="16" r="16"></circle>
  <circle class="c2" cx="16" cy="16" r="16"></circle>
  <circle class="c1" cx="16" cy="16" r="16"></circle>
...etc
```

And the CSS:

```css
--u: calc(100 / 12);

.c1 {
  stroke: hsl(0, var(--s), var(--l));
  stroke-dasharray: var(--u) 100;
}
.c2 {
  stroke: hsl(30, var(--s), var(--l));
  stroke-dasharray: calc(2 * var(--u)) 100;
}
.c3 {
  stroke: hsl(60, var(--s), var(--l));
  stroke-dasharray: calc(3 * var(--u)) 100;
}
/* ... etc */
```
The circles are wrapped in a `<g>`-tag with `id="wheel"`, so I can use `<use>` (pun intended) to clone the rings:

```xml
<use href="#wheel" class="r3" />
<use href="#wheel" class="r2" />
<use href="#wheel" class="r1" />
etc...
```
Each ring-class then sets a different `--l` (lightness) and `stroke-width`:

```css
.r1 {
  --l: 40%;
  stroke-width: 3;
}
.r2 {
  --l: 45%;
  stroke-width: 6;
}
/* ... etc */
```

In the final result I've chosen more tints than shades, so it's not as dark as in the book-example. Firefox has issues with setting some svg-attributes in CSS, so check it out in Chrome, Edge or Safari:

{% codepen https://codepen.io/stoumann/pen/zYNmZMN %}

---

## Let's have some fun! 

How about **rotating** those color rings – or changing the **saturation**? Scroll down to see and try the controls, if they're not at the top of the Pen:

{% codepen https://codepen.io/stoumann/pen/KKaGWJw %}

To have an **automated animation**, animating the `--r` custom property, we need to register a Custom Property:

```css
@property --r {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}
```

And the animation:

```css
@keyframes rotate {
  100% {
    --r: 360deg;
  }
}
```

Resulting in this (you need Chrome/Edge with Houdini):

{% codepen https://codepen.io/stoumann/pen/abpRJgy %}

Don't stare at it too long – or you'll be hypnotized!

Thanks for reading!
Customize Android Studio UI
Tags: android, custom, androidstudio, ui
Published: 2021-04-23 13:40:07


_This isn’t related to code or any other code-related aspect. It is just a fun article about customizing the look and feel of Android Studio IDE._

* * *

Let’s get started:

So if you have installed the latest version of Android Studio 4.0 (at the time of writing) you should have a UI which looks something like this:

![](https://cdn-images-1.medium.com/max/1200/1*P-eDSgN8fySqAmfpDaJ4mQ.png)

First let’s install the [**_Material Theme UI Plugin_**](https://plugins.jetbrains.com/plugin/8006-material-theme-ui)

> File -> Settings -> Plugins

![](https://cdn-images-1.medium.com/max/1200/1*vqtePaiZH_bNavLn1tSeBg.jpeg)

[Vendor: Mallowigi](https://github.com/mallowigi)

**Restart the IDE**

**After it has been restarted you should either have a theme already applied or a custom setup page depending on whether you have installed it previously or not. Don’t worry, I’m going to mention the theme options which will mostly end up to be dark themes.**

> To choose a very dark theme go ahead in Tools -> Material Theme -> Material Theme Chooser -> Darker Theme

![](https://cdn-images-1.medium.com/max/1200/1*ebHvtUbuA02-QQ_B23z8ew.png)

> Similarly for the accent color too,

> Tools -> Material Theme -> Accent Colors -> Fuschia Accent Color

![](https://cdn-images-1.medium.com/max/800/1*_jjmZU6FjabTfO6Wze6WAA.png)

> Toggling Contrast On can amp up your color tones by a bit,

> Tools -> Material Theme -> Panel Options-> Toggle Contrast

![](https://cdn-images-1.medium.com/max/1200/1*yOIw5RBmLuZjL0HxKoP4ag.png)

> You can also change the arrow styles if you want from the panel,

> Tools -> Material Theme -> Panel Options-> Arrow Styles

![](https://cdn-images-1.medium.com/max/1200/1*L9oxnGcMQ6HkZ6g939GtWA.png)

#### I use the Material Arrows styles which look like the ones below:

![](https://cdn-images-1.medium.com/max/800/1*kYhUwQcfn_P_0BiwG3W_3Q.jpeg)

_Below are some theme previews:_

### Atom Dark

![](https://cdn-images-1.medium.com/max/1200/1*tm9AnKq-NCIa7PRZMX0N_Q.png)

### Deep Ocean

![](https://cdn-images-1.medium.com/max/1200/1*VUhajPcZoi-ruHUO_y5C9A.png)

### Monokai

![](https://cdn-images-1.medium.com/max/1200/1*YqmMvyoO-6M2YZ5bNqHDSw.png)

### Oceanic

![](https://cdn-images-1.medium.com/max/1200/1*iJS-tGu1H4gFIgNwSGVeAA.png)

### Darker Theme (with High Contrast toggled ON)

![](https://cdn-images-1.medium.com/max/1200/1*i4VI1lj8Q6DyyY-LvxJ08A.png)
Manage Amazon S3 Buckets with Python in minutes — Part 2
Tags: cloudcomputing, aws, s3, awss3
Published: 2021-06-14 07:30:40

---
title: Manage Amazon S3 Buckets with Python in minutes — Part 2
published: true
date: 2021-04-23 13:30:27 UTC
tags: cloudcomputing,aws,s3,awss3
canonical_url: https://medium.com/analytics-vidhya/manage-amazon-s3-buckets-with-python-in-minutes-part-2-2eeda1c8efe
---

[![](https://cdn-images-1.medium.com/max/2000/0*Ka67PTKFL9T_ThEL.jpeg)](https://medium.com/analytics-vidhya/manage-amazon-s3-buckets-with-python-in-minutes-part-2-2eeda1c8efe?source=rss-6a5fd2acfac------2)

Use a familiar programming language like Python to create and access Amazon S3 resources.

[Continue reading on Analytics Vidhya »](https://medium.com/analytics-vidhya/manage-amazon-s3-buckets-with-python-in-minutes-part-2-2eeda1c8efe?source=rss-6a5fd2acfac------2)
How much does it cost to build a healthcare app?

Tags: mobile, webdev
Published: 2021-04-23 13:20:42

The cost to build a <a href="https://en.wikipedia.org/wiki/MHealth"><b> healthcare app </b></a> is on average $410,000, not including post-launch maintenance and promotion. However, for complicated solutions, this number is insufficient.

An efficient health care smartphone app includes a wide range of functions. Besides, the expense of developing a healthcare mobile app is determined by a variety of variables, including the kind of mobile app you choose to develop and the functionality and functionalities you choose. The expense of creating a healthcare smartphone app is challenging to predict.

Additionally, the healthcare app development cost is determined by the device on which you choose to develop your mobile app (Android/iOS/Cross Web (Flutter)) and the region in which the custom <a href="https://www.aalpha.net/services/mobile-app-development/"><b> mobile app development </b></a> business is based. An app development company in the United States costs about $150–250 per hour, an app development company in Europe charges about $85–150 per hour, and an app development company in India charges about $10–45 per hour.

Read original source: <a href="https://www.aalpha.net/articles/how-much-does-it-cost-to-develop-a-healthcare-mobile-app/"><b> healthcare app development cost </b></a>