teleren/devto huggingface dataset:
AWS Managed ADのユーザーをGoogleに同期する
Tags: aws, activedirectory, google
Published: 2021-06-30 02:19:42

[AWS Managed AD x AWS SSOでGoogle Workspaceにログインする](https://dev.to/ryanch79/aws-managed-ad-x-aws-sso-google-workspace-2kf8)の記事で、AWS Managed Microsoft ADとAWS SSOを利用し、Google Workspaceにシングルサインオンする方法を紹介した。

シングルサインオンをセットアップしただけなので、この時点ではユーザーの同期（プロビジョニング）は行われていない。つまり、AD側でユーザーを作成したり削除したりしたら、Google側でも同じ操作をしてあげなければならない。

認証はシングルサインオンで行うのでパスワード管理を別々にする必要はないとしても、これじゃ大規模組織のユーザー管理は非現実的だ。なので、ユーザー同期もセットアップしてみる。

<br>
GoogleはGoogle Cloud Directory Sync（GCDS）というツールを提供しているため、これを利用する。

設定手順はこちらのGoogleのドキュメントの通りでOK。
https://cloud.google.com/architecture/identity/federating-gcp-with-active-directory-synchronizing-user-accounts

なお、単純に同期を設定する前に、当然ADとGoogleでは設計思想が異なるしユーザー同期においても色々と検討すべきことがある。かなり長いが、こちらの概要のドキュメントをしっかり読んでおくことをおすすめする。
https://cloud.google.com/architecture/identity/federating-gcp-with-active-directory-introduction

<br>
今回は、GCDS専用のEC2インスタンスをt2.mediumでたててそこにC\GCDSインストールした。ユーザー同期用に利用するAD側ユーザー（手順内では「gcds」）は特に管理者権限を与えなくても大丈夫だったので、AWS Managed ADでも特に問題なく利用できる。

唯一Googleのドキュメントの手順に加えて要検討だったのは「ユーザーのプロビジョニング」→「ユーザー マッピングの構成」の中のユーザーの「Search Rule」だ。

ここではBase DNを空にしているが、AWS Managed ADはゼロから構築したADとは少しOU構造が異なるので、内部システム用アカウント等を誤って拾わないように、Base DNはAWS Managed ADのユーザーに割り当てられたOUのDNを設定した。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ew8nyo4caeqod8mrcvgw.png)

※今回は、NETBIOS名「CREATIVE」を指定しているので、DNは「OU=CREATIVE,DC=your-domain,DC=com」という感じになっている


<br>
DNの書き方が分からない人は、こういうやりかたで確認できる。

Active Directory Users and Computersの管理画面から、Advanced Features（詳細設定）を表示させるよう設定する。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ao27p7rg2no36tb45sw.png)

AWS Managed ADで管理されるOUがNETBIOS名で表示されているはずなので（この例では「CREATIVE」）、これを右クリックしてプロパティを表示。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lvxl6lfq6ai4hrz9lomn.png)

Attribute Editorタブで、`distinguishedName`を探して、その値を控えればそれがDNだ。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ntg254egrqnj2kt9drka.png)
 
 <br>
そんなこんなで、GCDSの設定も終わり、AD側で新たに作成したユーザーが問題なくGoogleにも作成されたことを確認できた。

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uopkindmgnj58wv9acbe.png)
 
あとはこれをまたドキュメントの手順通りに定期実行されるように設定すれば、自動化完了。
Moving a static HTML element into a dynamically created element with JavaScript. 
Tags: javascript, todayilearned
Published: 2021-06-30 01:59:27

## Context:
I was building a series of modals that open separately when their corresponding button was clicked. Each modal was split in two parts. The left side was a SVG of a tank, and the right, a form with some inputs and a update button. 

The tank's SVG fill gradient would change depending on the inputs entered in the form to its right.
![tank-1-modal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0523oz3k0zjyj97vmxp9.png)
 

I was coding all of this out in Javascript, using ALOT of 
```js 
document.createElement // Practicing my DOM skills :)
```

When it came time to recreate the SVG in JavaScript, it became a bit much. Especially since I had six to do.


## Solution
![Component 1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e3j1g1zj3t83amvf04zj.png)
 

### HTML & CSS

- Code the SVG inside the HTML parent that the dynamically created modal will be appended to later.
     - The SVG being placed inside the modals parent will make it easier to traverse the DOM later and place it inside the modal.
- Add a CSS class of hidden to the SVG element.
```css
.hidden {
  display: none;
}
```


### JavaScript

On the lines after I created the modal
- Grab the SVG by its class name
- Grab the element that will be the SVGs new parent
     - target it by traversing the DOM in relation to the SVG elements current location
- Append the SVG to the new parent
- Remove the hidden class

```js
const svg = document.querySelector(`svg-tank-1`);
const svgLocationTarget = svg.nextElementSibling.children[2].children[0].children[1];
svgLocationTarget.appendChild(svg);
svg.classList.remove("hidden");
```

###TADA!!!
I took a hard coded HTML element and relocated it inside a dynamically created element. Then I made it visible by removing the "hidden" class name.
On APIs and REST Architecture (Part 1)
Tags: api, javascript, rest, http2
Published: 2021-07-10 20:11:56

---
title: On APIs and REST Architecture (Part 1)
published: true
date: 2021-06-30 00:52:27 UTC
tags: api,javascript,rest,http2
canonical_url: https://medium.com/codex/on-apis-and-rest-architecture-part-1-f64449a2f177
---

[![](https://cdn-images-1.medium.com/max/2600/0*r6xaW_gTkQH0fYTX)](https://medium.com/codex/on-apis-and-rest-architecture-part-1-f64449a2f177?source=rss-be00f566a88f------2)

A introduction to client-server interactions in JavaScript

[Continue reading on CodeX »](https://medium.com/codex/on-apis-and-rest-architecture-part-1-f64449a2f177?source=rss-be00f566a88f------2)
How I got my first job in tech.
Tags: career, beginners, watercooler, devjournal
Published: 2021-06-30 00:33:37

As a bootcamp grad(Flatiron School) I constantly get asked how I landed my first job in tech. 

Here's what i've learned from that experience. 

## Applying to jobs online.
As a recent grad applying to jobs online directly on the company website is almost always a waste of time. Unless you have years of experience or a top tier collage listed on your resume you’ll almost never get an interview, their resume system will almost always reject you.

I learned this the hard way after applying for almost 150 jobs online and rarely hearing back.

## Networking, networking and networking.
Networking is what worked for me, after applying online with no results I turned to my community, friends and schoolmates.
My job at Sitepod came from a high school friend who was working there and they happened to be looking for a full stack Rails developer.
Meetups and job fairs are also really great for making these connections.

>*"It's not 'what' you know but rather 'who' you know"*

## Get work experience ASAP.
As a recent grad, unless you're applying for unpaid internships, recruiters need to really believe in you to give you that first shot since it’s their reputation on the line.
Try to get real world work experience on your resume/LinkedIn asap.
Volunteering for public projects or just building stuff for friends and family will give you that experience to put on your resume, plus you’ll have so much more to talk about when interviewing for that first job.
Make sure to put start and end dates on those freelance gigs and list them as experience on your resume, not projects (Resume Hack...).

## Getting interviews from Linkedin
I’ve successfully gotten interviews by direct messaging developers, hiring managers and recruiters.
Try to find people that are close to your network or may have attended the same school etc.
Commenting on recruiter posts is also a great way to get their attention. 
Make sure to message only those that have entry level positions listed on their company website or posts so not to waste your time.
Also ensure that those companies are looking for similar technologies to those that you have so as to eliminate any friction. 
Many companies give employees the ability to refer people to their available positions which will almost always get you at least a phone call .

#### Here’s a template i’ve successfully used over time when messaging recruiters on LinkedIn:

>Hi [name],
>I saw that you're hiring for software engineering positions in NYC.
>I’m currently a full stack web developer with experience in [technologies].
>I’m looking for a position in a company like [company name] where I can grow and utilize my skills to the fullest.
>I would love it if you can give me a few minutes of your time to get to know each other and see what value I can bring to [company name].
>Thanks In Advance!

Hope this helps!
Postgrey - Simple, Fast & Async Library for PostgreSQL
Tags: python, postgres, sql, orm
Published: 2021-06-30 00:19:23

## Postgrey
🐘 Simple, Fast, Async & ORM PostgreSQL database client based on [Asyncpg](https://github.com/MagicStack/asyncpg) for Python.

## Links
- [GitHub](https://github.com/5elenay/postgrey)
- [PyPi](https://pypi.org/project/postgrey)

## Installation
Just type `pip install postgrey` to your favorite terminal and you are ready to go!

## Features

- **Simple**: You can learn Postgrey in less than a hours!
- **Fast**: Since Postgrey is based on Asyncpg, Postgrey is really fast.
- **Secure**: Postgrey has SQL injection protection.
- **ORM**: You don't need to learn SQL for your apps.
- **Freedom**: If you are a SQL master, you still can execute SQL commands.
- **Asyncpg**: You easily can use Asyncpg in Postgrey.

## Documentation

Check [GitHub](https://github.com/5elenay/postgrey/tree/main/docs) for documentation.
#100DaysOfCodeChallenge - Crop Management Information System - Day 7
Tags: 100daysofcode, flutter, dart, programming
Published: 2021-06-30 00:17:52

## Recap

On [Day 6](https://dev.to/curtlycritchlow/100daysofcodechallenge-crop-management-information-system-day-6-2fde) We received user input data via our Farmer form and save the form data in cloud firestore.


## Overview

In this post we should of been implementing the camera functionality and layout. Unfortunately the method `await _picker.getImage(source: ImageSource.camera);` throws an error.
```
Exception has occurred.
PlatformException (PlatformException(no_available_camera, No cameras available for taking pictures., null, null))
```  This error shows up only on the android emulator but not on a physical device. The android emulator camera works as expected when using the camera app.


## Wrap Up

If you have as solution to this problem comment below. Until then I will continue to troubleshoot and hopefully find the solution sooner rather than later.

## Connect with me

Thank you for reading my post. Feel free to subscribe below to join me on the #100DaysOfCodeChallenge or connect with me on [LinkedIn](https://www.linkedin.com/in/curtlycritchlow/) and [Twitter](https://twitter.com/CritchlowCurtly). You can also [buy me a book](https://www.buymeacoffee.com/curtlycritchlow) to show your support.
Views in SQL 
Published: 2021-06-30 00:12:57

### What is a View 
TLDR: A view is like a query you can save for later. 

A view is defined as a mechanism for querying data. I think of it as a way to create a query and save it for later. By creating a view you have access to a specific set of data without creating a new table or taking up space. 

### How Can I create a View 

A view can be created by assigning a name to a select statement and then storing the query for others to use. (Similar to how we can store a value in a variable to use later). Then, other people can use your view to access data as if they were querying an actual table. Sometimes you don't even know you're using a view. 

```
CREATE VIEW customer_vw 
AS 
SELECT 
customer_id, 
first_name name,
last_name surname, 
concat(substr(email, 1, 2), '*****', substr(email, -4)) email 
FROM customer; 
```
The first part of the statement gives the view a name `customer_vw`. The second part of the statement is a select statement which must contain one expression for each column in the view. 
Once this view is created it can be queried just like a table! 

We can also use `desc customer_vw` to examine the fields and types that make up the data in the view. 

You can join views to other tables too. 

### Why Use Views 
1. Data Security - you can use views to mask data you don't want others to see 
1.  Data aggregation - you can use views to preaggregate data so that when others query the view they are querying data that may be more meaningful than just raw data from the database. 
1. Hiding Complexity
Writing a Leetcode Kotlin Android App - Day 0
Tags: android, kotlin, leetcode
Published: 2021-06-30 00:06:25

My goal for this journal is to plan and document my development of a Leetcode-related Android application. [Leetcode](https://leetcode.com/problemset/all/) is a web site for studying Data Structures and Algorithm problems.  

While there are [many](https://play.google.com/store/search?q=leetcode&c=apps) applications on Google Play dedicated to the study of Leetcode problems, none of them provide solutions in [Kotlin](https://kotlinlang.org/).

And that's what I want to do. At the most basic level, I want to create an application that provides solutions in Kotlin. 

My secondary goal is to also deepen my understanding of Leetcode problems. And to that end, aside from doing a [Pramp](https://www.pramp.com/invt/M54E142q2bu695Ex0zqv) every day, my plan is to provide a useful breakdown of those problems for studying purposes, and perhaps supplement some of those problems with animations or videos (just like this [app](https://play.google.com/store/apps/details?id=wiki.algorithm.algorithms) does using animations, or just like this Chrome [extension](https://chrome.google.com/webstore/detail/leetcode-video-solutions/ilnmgkahgjdpkoliooildngldmilhelm) does using existing youtube videos). 

With that said, I intend to keep the scope of this project as small as possible at the beginning. So the first iteration of this app will be extremely basic. It will have very basic functionality. And it will contain very few problems (taken from this subset of [75 problems](https://www.teamblind.com/post/New-Year-Gift---Curated-List-of-Top-75-LeetCode-Questions-to-Save-Your-Time-OaM1orEU)). From that subset, I will try to identify the most canonical ones, then I will expand outward. In other words, my initial objective will be to focus on quality, not quantity.
React Native — Fix Blank Flash After Splash Screen
Tags: reactnative, react, javascript, ios
Published: 2021-06-30 00:00:31

The splash screen is the first view of your React Native app that a potential user sees. Whether they just downloaded the app or are opening it the thousandth time, users are immediately greeted with your splash screen. Therefore, it is of the utmost importance to promote a great user experience around the splash screen.

The concept of the splash screen was created as a placeholder to display while the app is loading. This makes phones feel responsive and creates the illusion that the app loads instantly. While this usually works out of the box for native iOS and Android applications, apps using React Native require additional steps during the loading process. This means loading your JavaScript bundle, initializing the JS-Native bridge and loading React.

> "As your App Bundle grows in size, you may start to see a blank screen flash between your splash screen and the display of your root application view."
> — React Native documentation

Users’ phones aren’t aware of the additional loading time, so the splash screen disappears before React and the JavaScript bundle are loaded, and a blank flash occurs. Although the flash is brief, it’s a terrible user experience and it can feel disorienting.

Thankfully, there’s an easy fix! You can add the following code to AppDelegate.m in order to keep your splash screen displayed during the transition:

![// Place this code after "[self.window makeKeyAndVisible]" and before "return YES;"
  UIStoryboard *sb = [UIStoryboard storyboardWithName:@"LaunchScreen" bundle:nil];
  UIViewController *vc = [sb instantiateInitialViewController];
  rootView.loadingView = vc.view;](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/md4b5dqc9vj338i7xq9h.png)

Now rebuild your app and enjoy the seamless splash screen!
They don't pay you to type
Tags: career, productivity, kpi
Published: 2021-07-01 13:53:11

---
title: They don't pay you to type
published: true
date: 2021-06-30 00:00:00 UTC
tags: career,productivity,kpi
canonical_url: https://jhall.io/archive/2021/06/30/they-dont-pay-you-to-type/
---

A few years ago I was working as a backend developer on a web application. One day the CEO of the company asked me to fix a bug in the frontend code. Now, I’ve dabbled in some JavaScript, so I _can_ read through most frontend code and get a general idea of what’s going on. But the last time I was doing any serious frontend development was back in the dark ages of jQuery 1.4 or so. React and Angular weren’t even concived of yet.

So when I was asked to fix a bug in a modern web frontend (probalby using React or Vue), I protested, and said it wasn’t really my area, and that I didn’t know how to do it.

A couple hours later he came back to me and said, with clear frustration, “I fixed it. See? It was EASY!” and he showed me a 1-line fix in GitHub.

What the CEO forgot in this instance is that he didn’t hire me to type 1-line fixes. If he had, I would have been perfectly capable of typing in the fix, and probably faster than him (I am a _very_ fast typist). Of course, that assumes that he showed me the appropriate fix to type in first, of course.

Instead, he had hired me _to solve problems_. And neither the difficulty of a problem, nor the time it takes to solve it, can be measured by how many lines of code it takes to solve.

The fact that he was able to solve the problem in (apparently) a few minutes may indicate that the problem was in fact easy (for someone with the right knowledge).

Never measure your worth as a developer (or that of any other) by the number of lines you edit, or by how long it takes to fix a bug. The problems you’re paid to solve are much more complex (and we hope interesting) than that!

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
CopyDock - Handy VSCode Extension
Tags: copydock, development, extension, vscode
Published: 2021-06-30 00:00:00

---
title: "CopyDock - Handy VSCode Extension"
date: "2021-06-30"
categories: 
  - "programming"
  - "vscode-extension"
tags: 
  - "copydock"
  - "development"
  - "extension"
  - "vscode"
---

![1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7c3w2kufk48m0xz736vv.png)
 

CopyDock

I've been working on a project with my friend and while we were coding, we got at some point that I've to write my friend's code to my computer because that code was working or transfer the development environment values to my Workspace, but it's a long way to copy that text or code snippet to my PC; usually via a messaging platform like **Telegram**, so I decided to develop an extension for **VSCode** that could do that job easily. And in this post we'll see how we can use **CopyDock**.

## Step 1 - Installation

Open your Visual Studio Code editor and go to extension tab and search for "CopyDock" or you can just visit the link below to install the extension.


Direct link to the extension: [https://marketplace.visualstudio.com/items?itemName=xencodes.copydock](https://marketplace.visualstudio.com/items?itemName=xencodes.copydock)

After the installing you will see your **ID** at the bottom menu of VSCode.



![2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6xqnqgv6pdj9a00t19nz.png)

Here, my ID is **oj**

## Step 2 - Transfer your Code

Now, it's time for you to do a selection of the code snippet or any other text and right-click on it, and then hit "Send Code", next you will be asked to enter **User ID**; you will have to put your friend ID in the input box and press enter to transfer the selected text into your friend's Workspace.

![3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bul2igp1vdkajhy1bqjx.png)
![4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e39rk6bqrb3lmjcg4hil.png)
  

As you can see, I entered **nR** in the input box as User ID to transfer the selected text to my another Visual Studio Code instance (for the demonstration I used VSCode and VSCode Insiders).

And soon you hit `Enter`, your selected should get copied over to your friend's Workspace.

 ![5](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/17guoue0pnvk1w940duh.png)
How to Inspect a Disappearing Element E.g. Dropdown Menus
Tags: todayilearned, tooling, css, javascript
Published: 2021-06-29 23:49:42

> How to inspect and modify the CSS of elements that are only displayed when they are or their parent are in focus.

Or in other words how to inspect an element which disappears when the mouse moves away? 

E.g. dropdown menus. These are often only displayed when you give focus to their parent or some other item that triggers them to open.

How can we stop a dropdown menu closing so we can debug it?
____________

### The Problem
Today I wanted to inspect the CSS of a dropdown menu to see why it was not behaving as possible and then modify the CSS directly in devtools.

E.g. The dropdown below is opened when the user clicks in the TextBox. I wanted to inspect the options in the dropdown; to do so in Chrome I need to right click on an option and select `Inspect`

But this causes the TextBox to lose focus and the dropdown disappears.

![Dropdown image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oilvdx9qoscaucpd06xf.png)


### The Solution

Is really simple...

Inspect the TextBox control and find the element which triggers the dropdown. In my case it is an input.

Inspect the input and select the `Event Listeners` tab.

Locate the blur event and click the `Remove` button.

![Remove Blur Event](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/034ns476ijyit5tv3dsf.png)

_______
You will now be able to inspect the dropdown because the blur event will not fire when you leave the textbox. 🕵️
Python artificial intelligence projects for beginners
Tags: pyhton
Published: 2021-06-29 23:22:27

Contents
Overview
AI project in python
**Overview** 
One of the things you must have to learn Python is time. We are using artificial intelligence to change this world. And to get this support we need to know programming language and  It is important to learn the language because the computer understands the language of 0's and 1's. We have to talk to the computer first to become very proficient.  All the codes in the English language are very simple. Scientists have created this Python language because you can understand English well and all its codes are in English.  This is a language that even a small child can learn in 3 months. There are free courses from Google that give you a lot of information about Artificial Intelligence. Nowadays it is being taught in schools, colleges and institutions. This language is free.  It works. If you want to create a website, it has a lot of libraries. It has a lot of developers.

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

**AI project in python**
1. Build a prediction model using decision trees and random forest.
2. Use neural( Networks),( decision trees, )and random forests for classification.
3. Detect YouTube comment spam with a bag-of-words and random forest.
4. Identify handwritten, Mathematical symbols with convolutional neural Network.
5. revise the bird species identifier to use image.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6xslkiy9of30z9vvr6qg.jpg)
Friends, when computers were made, the main purpose of making them was to reduce the worries of human beings. What we used to do with our hands, now we don't have to work with our hands. Now all our work is done by our computers.  We can say a program that automatically thinks about what to do. Just like our brain controls the whole body, robots look like plastic and steel, but they have such code or program inside them.  There are robots that control the house. Nowadays robots are being made to clean the house. And a car has also been made that travels with the help of Google map. It takes you to your original location.  There is no need for a driver in such a car. Similarly, many diseases are also known. Similarly, Google, YouTube, Amazon all work on artificial intelligence.

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