teleren/devto huggingface dataset:
Elastic Beanstalk에서 hooks를 이용할 때 권한이 없는 문제
Tags: aws
Published: 2021-08-22 07:25:40

엘라스틱 빈즈토크의 운영체제가 아마존 리눅스 2<sup>AL2</sup>로 바뀌면서 사용법도 많이 바뀌었다.

내 문제는 레일즈에서 webpacker를 사용하면서 yarn을 설치해야하는데, AL2가 되면서 .ebextension 대신 훅<sup>hooks</sup>을 이용함으로써 발생했다.
```shell
.platform/hooks/prebuild/yarn.sh: permission denied 
```
⠀
⠀

정말 말그대로 권한에 문제가 있었다. 파일 권한에...
[답변 링크](https://forums.aws.amazon.com/thread.jspa?threadID=321653&tstart=0)
⠀
아래 커맨드로 해결했다.
```shell
$ git update-index --chmod=+x .platform/hooks/prebuild/yarn.sh
```
![스크린샷 2021-08-22 15.57.29](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ax0j4ihhxatjtec6zkp5.png)
커밋을 잊어선 안된다.
![스크린샷 2021-08-22 16.07.03 2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jyawy926u9nsrnw3k2bq.png)
644에서 755로 권한이 변경된걸 확인할 수 있다.
 
⠀
⠀
### 후기
며칠을 검색해도 못찾았는데, 1년 흐른 후 새로운 프로젝트에서 같은 문제를 접했을 땐 검색 몇번으로 해결했다. 살짝 허무했다.
Create an infinite scrolling animation with CSS 💥
Tags: animation, css, webdev
Published: 2021-08-22 07:12:35

---
canonical_url: https://blog.avneesh.tech/create-an-infinite-scrolling-animation-with-css
---

You might have seen an infinite autoscrolling animation on a website with some logos. This scrolling animation looks really good. So let's see how we can do that

![Let's do it](https://media.giphy.com/media/BpGWitbFZflfSUYuZ9/giphy.gif?cid=ecf05e47rvzs6jvgw18x08dm3o4gana6iutza5p9d5ozvs4o&rid=giphy.gif&ct=g)


**Creating a container with 6 divs inside it**

```
<div class="container">
  <div class="pink"></div>
  <div class="blue"></div>
  <div class="yellow"></div>
  <div class="orange"></div>
  <div class="purple"></div>
  <div class="aqua"></div>
</div>
```

Adding simple styles to the container and giving the divs a width, height, and different colors. You can also have images here.

```
.container {
  overflow: hidden;
  display: flex;
  height: 500px;
  width: 1500px;
  margin: 0 auto;
}

.container div {
  height: 400px;
  min-width: 300px;
  margin-left: 100px;
}

.pink {
  background-color: pink;
}

.blue {
  background-color: blue;
}

.yellow {
  background-color: yellow;
}

.orange {
  background-color: orange;
}

.purple {
  background-color: purple;
}

.aqua {
  background-color: aqua;
}
```


**Adding a keyframe -**

```
@keyframes slide {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-1500px, 0, 0); /* The image width */
  }
}
```

**Using the keyframe animation in the container**
```
.container div {
  height: 400px;
  min-width: 300px;
  margin-left: 100px;
  animation: slide 15s linear infinite;
}
```

Ta-da it was as simple as this to get it working!

https://www.loom.com/share/a2339e51fcf942a99de46264190e3c94

Hope you liked this mini-tutorial, I will meet you in the next one ✌🏻

 **Useful links-**

 [Code](https://codepen.io/avneesh0612-the-bold/pen/BaZBwzq) 

[Social links](https://avneesh-links.vercel.app)
All About Loops and Iterations in Javascript.
Tags: javascript, webdev, html
Published: 2021-08-22 06:52:40

## Are you confused among different kinds of loops in Javascript? No worries, I am here to help you out. I will explain every kind of loop in Js in this blog post. 
So, lets get started....

**We need loops** when we want to perform some task repeatedly. Of course you don't want to write the same thing again and again.
>Have some pity on your hands. So use loops if you want to save them :)

### 1.For Loop:
The for loop performs some task until a specified condition becomes `false`.
The `syntax` of for loop is:
```
for ([initialExpression];[conditionExpression]; [incrementExpression]){
  //code to be executed
}
```
Initially `initialExpression` is executed and then if `conditionExpression` return true, then only the code inside the for loop is executed.
And then `incrementExpression` is executed. It mostly increment or decrement the counter.
If `conditionExpression` returns true, the loop stops right there. 

## 2. While Loop:
The while loop runs until the specified condition returns `false`.
Syntax:
```
while (condition) {
  // code to be executed
}
```

### 3. Do...While Loop:
The do...while loop runs until a specified condition returns false.

Syntax:
```
do{
  // code to be executed
}
while (condition);
```
In this loop, the piece of code inside `do` block will always get executed atleast once.
Then the `condition` inside while is checked. If it returns `true` the loop continues to run else the loop stops its execution.

### 4. For-In Loop:
The for-in statement loops through the properties of an iterable  object.
Syntax:
```
for (variable in object){ 
  //do something
}
```
It returns the `index` of each value inside the object/array.
For Example:
```
let myFriends = ['vinod','ramesh','arjun','vishal'];
 for(let elements in myFriends){
   console.log(elements);
}
```
Output: 0 1 2 3 

### 4. For-Of Loop:
The for-of statement loops through the properties of an iterable object.
Syntax:
```
for (variable of object){ 
  //do something
}
```
It returns each `value` present inside the object/array.
For Example:
```
let myFriends = ['vinod','ramesh','arjun','vishal'];
 for(let elements of myFriends){
   console.log(elements);
}
```
Output(each in new line): vinod ramesh arjun vishal 
>This time we are getting values not indexes.

Thats all for now! I hope you enjoyed it reading. Any suggestions or improvements are welcomed.
How to clear scrollback on screen
Tags: linux, tutorial
Published: 2021-08-22 06:41:29

## Sumarry

I wanted to make my [Konsole](https://konsole.kde.org/) to let me clear scrollback while I am using [screen](https://www.gnu.org/software/screen/) so I googled how to do that.

## Answer

```
~/.screenrc
======
defscrollback 50000

# Press "Ctrl + a", "/" and then "Enter" to clear scrollback
# - Konsole disables the functionality if it is on subshell (= screen)
bind / eval "clear" "scrollback 0" "scrollback 50000"
```

## References

- [Scrolling is disabled all of a sudden in terminal](https://unix.stackexchange.com/questions/259922/scrolling-is-disabled-all-of-a-sudden-in-terminal)

- [How to clear the scrollback in the screen command?](https://stackoverflow.com/questions/113427/how-to-clear-the-scrollback-in-the-screen-command)
Day 9 : addEventListener('click', ..) and .onclick are not the same
Tags: javascript, webdev, beginners, 100daysofcode
Published: 2021-08-22 06:38:13

so, this is different from previous posts. The past week was the first week of me posting any article on the web. Even after not writing everything in detailed form, the response I got was beyond my expectations. From now on, I will try my best to cover everything in detail.. 

----


## `addEventListener('click', ....)` and ` .onclick` are not the same

Yes, they are not the same. The difference being that in the  `addEventListener` , we can add multiple listeners to the same event. While the `onclick` "overrides" the previous `onclick` attached to the same event. 

For example:- see the below codepen 





{% codepen https://codepen.io/grvskwt/pen/RwgbjaO %}

As a result, in the console:
When we click the onClick Button, only `I’m also clicked!` is logged out
When we click the addEventListner Button, both `I’m clicked!` and `I’m also clicked!` are logged out


To conclude, although we can attach the same event with different syntax, using addEventListener(‘click’, …) we can have multiple listeners on one event, whereas using onclick we can only assign one listener to one event (which is always the latest assigned listener).


Please open the above codepen through "edit in codepen" and then see the outputs in the console. I have added enough comments to make you understand everything. In case of any doubt, please do comment.


The full reference about the above point can be found at [Medium](https://medium.com/@ysmiracle/use-addeventlistener-instead-of-onclick-oninput-onchange-especially-when-working-in-teams-50ad40badb8d).
All About Git and Github.
Tags: webdev, git, github, versioncontrol
Published: 2021-08-22 04:59:09

## Hey there! Are you confused between Git and Github and want to know more about it? Then give this blog a read. I will try to provide all the details about it.
Let's get started....


### What is Git?
Git is a version control system which is used for tracking changes in source code during software development process.
It was first developed in 2005.
Git is installed on your local machine so that you can use tools like Github, which uses the git mechanism.

### What is version control?
Version control, as we can understand from the name itself, it is like controlling the versions of our project/software that we develop.
We can track and log the changes that we have made. It gives us the power to review them and we can even go back to the earlier versions that we have saved.

### What is Github?
We can say that Github is a cloud-based tool which uses Git's functionality and provides us the built-in version control system.
We can share our code online on github, by making a repository on it. And also we can host our project on it by using its hosting service.

### Commonly Used Git Commands
#### 1. Git init
This command is used to initialize an empty Git repository. This can be probably the first command you run in a newly created project.
`cd` into the folder and run the following command:
```
$ git init
```

#### 2. Git status
This is a very helpful command. Sometimes you forget where you are on your git repo. So just run this command, this will tell you a lot of things like: 
your current branch, what is committed, pushed or pulled, your branch is up to date or not and a lot more things.
Syntax:
```
$ git status
```

#### 3. Git add
Whenever you make any change to file, create a new file or delete any file. You need to run this command. It will add the files to the staging area but it will not make any change in the remote repository.
Syntax:
To add a single file:
```
$ git add <filename> 
```
To add all the files (the dot is mandatory at the end):
```
$ git add . 
```
Lambda Function in Python
Tags: programming, python, performance, functional
Published: 2021-08-22 06:22:16

Python :snake: is no doubt, one of the coolest programming language ever created. And its uniqueness and features, are all a par. One of the most awesome feature of Python is: _Lambda Function_

# LamWhat?
Lambda Function, aka. anonymous function. A lambda function is a small anonymous function. It can take any number of arguments, but can only have one expression.

## Syntax
```python
lambda arguments : expression
```
The expression is executed and the result is returned:

### For example
Add 10 to argument a, and return the result:
```python
x = lambda a : a + 10
print(x(5))
```
The best part of Lambda function is, it is not limited to a single argument only. Rather, it can take as many arguments as required. For example in the code snippet shared below, it summarizes argument a, b, and c and return the result:
```python
x = lambda a, b, c : a + b + c
print(x(5, 6, 2))
```

## Why use Lambda Function
The power of lambda is better shown when you use them as an anonymous function inside another function.

Say you have a function definition that takes one argument, and that argument will be multiplied with an unknown number:

```python
def myfunc(n):
  return lambda a : a * n
```
Use that function definition to make a function that always doubles the number you send in:

```python
def myfunc(n):
  return lambda a : a * n

mydoubler = myfunc(2)

print(mydoubler(11))
```
Or, use the same function definition to make multiple functions, in the same program:

```python
def myfunc(n):
  return lambda a : a * n

mydoubler = myfunc(2)
mytripler = myfunc(3)

print(mydoubler(11))
print(mytripler(11))
```

## Examples


**Note:** *Use lambda functions when an anonymous function is required for a short period of time.*
Create a Netflix clone from Scratch: JavaScript PHP + MySQL Day 27
Tags: php, javascript, webdev, tutorial
Published: 2021-08-22 06:14:35

Netflix provides streaming movies and TV shows to over 75 million subscribers across
the globe. Customers can watch as many shows/ movies as they want as long as they are
connected to the internet for a monthly subscription fee of about ten dollars. Netflix produces
original content and also pays for the rights to stream feature films and shows.

In this video,we will be completing verify account functionalities

{% youtube Y86nvigk0Bk %}


If you like my work, please consider
[![Buy me a coffee](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jm11knj7d8zwcvo150q2.png)](https://www.buymeacoffee.com/cglikpo)
so that I can bring more projects, more articles for you

If you want to learn more about Web Development, feel free to [follow me on Youtube!](https://www.youtube.com/c/ChristopherGlikpo)
How to list all hidden files and directories with ls
Published: 2021-08-22 05:56:15

在Linux中，隐藏文件就是以``.``开头的文件，所以列出所有的隐藏文件，其实就是列出所有以``.``开头的文件。

```
ls .?*
```

上面这个方案有个问题，就是将目录里的内容也递归列出来了，这不是我们的诉求，增加``-d``参数，把目录当作文件展示出来

```
ls -d .?*
```

如果希望通过列表形式展示，还可以增加``-l``参数

```
ls -ld .?*
```

进一步，如果我们只想列出所有的隐藏目录呢，不显示隐藏文件，可以增加``/``，所有的目录都有这个。
```
ls -ld .?*/
```

其实上面这个情况，我们可以增加``-p``参数会更明显，一个``-p``就代表如果是目录就在后面多增加一个``/``显示出来。

```
ls -ldp .?*/
```

换另外一个情况，如果我们只想显示隐藏文件，不想显示隐藏目录要怎么办呢？其实顺着上一个方案就好了，既然可以识别所有的目录，当然可以排除所有的目录

```
ls -ldp .?* | grep -v /
```

当然这个议题我们可以不局限在使用``ls``命令，还可以使用``find``命令，比如列出当前目录的所有隐藏文件，不包含目录
```
find .?* -maxdepth 0 -type f
```

列出所有的隐藏目录，不包含文件，命令很清晰，唯一的遗憾就是不带颜色显示
```
find .?* -maxdepth 0 -type d
```
What did you teach this week?
Tags: teachingthisweek, discuss
Published: 2021-08-22 05:47:25

It is said that teaching is a tough job, but it is one where you can make the most impact in another person's life. Teaching others not only helps those who are taught, but also is beneficial for those who teach as well.


Teachers are role models of the society. So why not be one yourself! You don't need to pick up the chalk and have a dash at the blackboard to become  teacher. Writing blogs, answering on stack exchange or helping a collogue with a tricky concept all count in teaching. 
![c9aceac39cd60aa014d9bbc7d59dce6a](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w3actij86zlud859eh75.gif)
 
There is no small or big role as a teacher, so please share your thoughts on this by commenting below. Let us all comment what we have taught others in this week. Let us all create a wave of positivity!
I made an App Store
Tags: javascript, linux, webdev, opensource
Published: 2021-08-22 04:57:01



## Why
I love checking out new stuff, apps, apis, websites and such. And my obsession for trying out  new stuff found me continuously visiting https://electronjs.org/apps. Its a website that allows people to browse apps made with electron. Developers add their apps by making a pull request to electronjs apps repo on Github. Every week there's always a new app added.

After visiting the website hundreds of times I started thinking why it wasn't an app store. I mean the general layout of it looks like an app store. At that time I was learning about reverse engineering closed apis and I thought it would be a fun project to build a desktop client for the website. On checking I saw that the api requests send back html which was not a problem as I had had some experience with parsing html from a previous project of mine [FLB Podcasts](flbpodcasts.netlify.app). So I knew how to build it but I didn't really have time to do it. But last week I decided to take a break from building [FLB Music](https://github.com/Patrick-web/FLB-Music-Player-Official) and build it.

## Where can I find it 
I just pushed the alpha build yesterday so its only available [here](https://github.com/Electron-Store/electron-app-store/releases) in the releases. 

## Features
- Browse Apps from 10+  Categories
- Search for apps by keyword and app name
- Download .exe , .appimage ,.dmg and other file formats
- Automatic Install for .exe files (.appimage soon, see roadmap)
- Loads the app website if the ReadMe is absent for the app page 

## Screenshots
Some screenshots...
![Explore Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ao2x2fuiiw0j7gigosa0.png)
![Download](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nnd9ssfo04swkejsdomw.png) 
![App Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/41dtnemo5njuncjpvney.png)


## Roadmap
- Install apps without spawning the installer modal
- Support installation of Appimages
- Create a CLI that has the same functionalty
- Encourage a Common ReadMe format from the app developers to have the app pages look more seeamless
- Support for Youtube preview videos shown on the website
Three Weeks To Go
Published: 2021-08-22 04:32:31

Three more full weeks means left in the program means that this was the third-to-last Saturday.

Today was also the last working day on SDC - and I still have a few things to do. Well, I do have Sunday so it's all good.

What do we have ahead? A mini-project in the MVP which'll span two days next week. Blue Ocean follows that. And a whole bunch of Career Services throughout, I do believe.

I'm looking forward to getting more involved with Career Services over the next few weeks. I signed up for this program to get a job and this is the head of the spear in that effort. I hope to build a strong relationship with my CS advisor and really use her as a resource and an ally.

For the MVP we're given our choice of project to build. Two days for a full-stack application. You already know what I'm doing. That's two days to work on the blog project. Maybe I can build a full feature. The questions-answers section would be tight. I lost some momentum on it over the SDC - which is expected and totally fine. But I'm hyped to get back into blog-building mode and feel the rush of energy and purpose that working on that project gives me.
The Async Series: Async Functions
Tags: javascript, webdev, codenewbie, beginners
Published: 2021-08-22 03:50:26

# The long awaited async function
In the last post, we covered promises and promise chaining with .then(). Promise chains provided an improvement over nested callbacks but in this post we'll cover something that does even better.


# A Recap
Recall our favourite async library lib from previous posts in this series. We saw how we can use the .then() method on promises to form a promise chain.

```javascript

    printBlue("Blue")
	.then(()=>printGreen("Green"))
	.then(()=>printRed("Red"))
        .catch(err=>console.log(err));
```

The promise chain synchronises the async calls so that they execute in the intended order.

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

# Async/Await

However, ECMAscript 2016 released the [Async/Await](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function) syntax, it allows us to declare async functions. In async functions we can use the **await** keyword. Await lets us block asynchronous promised based calls and get the value that the promise resolves to instead of using .then(). The following is previous code snippet converted to an async function.

```javascript

async function printFun(){
    try{
      await printBlue("Blue");
      await printGreen("Green");//doesn't execute until printBlue finishes
      await printRed("Red");//doesn't execute until printGreen finishes
    }catch(e){
      console.log(e);
    }    
}
```

Notice we use a top level try catch block instead of the .catch() method. Async functions lets uses easily **synchronize** promised based APIs in the top level. 

# It all adds up

Let's see how we can use this with the async add() function.

```javascript

async function  addAll(a, b, c, d, e, f){
   let res = await add(a, b);
   res = await add(res, c);
   res = await add(res, d);
   res = await add(res, e);
   res = await add(res, f);
   return res;  
}

```

The one thing to note however, is that *Anything returned by an async function will be wrapped in a promise*. So if we wanted to log the result of the last function we would have to do the following.

```javascript

//call .then() on the promise
addAll(6, 2, 42, 11, 20, -1)
  .then(function(res){
    console.log(res); 
  });

// OR use another async function

async function printSum(){
  let res = await addAll(6, 2, 42, 11, 20, -1);
  console.log(res);
}

printSum();

```

# Conclusion

An that's it for the async series. Async functions really makes things easier to work with async calls but just remember they return promises. I hope this series helped you get to grips with async code in JavaScipt. As always [here](https://replit.com/@Snickdx/async-3#index.js) is a REPL to try out the examples yourself.
Migrate an on-premises Microsoft SQL Server database to Amazon RDS via Amazon S3
Tags: aws, architecture, migration, database
Published: 2021-08-22 03:36:45

This migration process includes making a backup and restoring the backup in an Amazon Simple Storage Service (Amazon S3) bucket and using SQL Server Management Studio (SSMS).

This process includes following major steps:
1. Making a backup of on-premises database via SSMS (SQL Server Management Studio)
2. Transferring that backup file in Amazon Simple Storage Service (Amazon S3)
3. Finally, restoring the backup file in Amazon RDS for SQL Server.

![Architecture Diagram](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dherhuuwtdgb1jsf27vh.png)

####Create an Amazon RDS for Microsoft SQL Server DB instance
* Select SQL Server as the database engine in Amazon RDS for SQL Server.
* Choose the required SQL Server Edition

####Create a backup file from the on-premises Microsoft SQL Server database
* Connect to the on-premises SQL Server database through SSMS.
* Create a backup of the database.

####Upload the backup file to Amazon S3
* Create a bucket in Amazon S3.
* Upload the backup file to the S3 bucket.

####Restore the database in Amazon RDS for SQL Server
* Open the Amazon RDS console
* Choose Option groups in the navigation pane.
* Choose the Create group button.
* Add the SQLSERVER_BACKUP_RESTORE option to the option group
* Add the option group to Amazon RDS for SQL Server.
* Connect to Amazon RDS for SQL Server through SSMS.
* Call the rds_restore_database stored procedure to restore the database.

####More details on Restoring a database

As mentioned above for restoring the database in RDS call the rds_restore_database stored procedure. Amazon RDS creates an initial snapshot of the database after the restore task is complete and the database is open.

`exec msdb.dbo.rds_restore_database 
@restore_db_name='database_name', 
@s3_arn_to_restore_from='arn:aws:s3:::bucket_name/file_name.extension',
@with_norecovery=0|1,
[@kms_master_key_arn='arn:aws:kms:region:account-id:key/key-id'],
[@type='DIFFERENTIAL|FULL'];`

Example of single file restore:

`exec msdb.dbo.rds_restore_database
@restore_db_name='mydatabase',
@s3_arn_to_restore_from='arn:aws:s3:::mybucket/backup1.bak';`

Example of multifile restore:

`exec msdb.dbo.rds_restore_database
@restore_db_name='mydatabase',
@s3_arn_to_restore_from='arn:aws:s3:::mybucket/backup*';`

Check restoring task status:

`exec msdb.dbo.rds_task_status
[@db_name='database_name'],
[@task_id=ID_number];`

Example:
`exec msdb.dbo.rds_task_status @db_name='mydatabase';`

_Source:_ [AWS Documentation](https://docs.aws.amazon.com/)