teleren/devto huggingface dataset:
Amazon WorkDocs
Tags: aws, ecm, productivity
Published: 2021-08-29 21:49:17

---
title: Amazon WorkDocs
published: true
description: Secure content collaboration, simplified
tags: #aws #ecm #productivity
cover_image: ![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c52nj4ibpyyp7yaj5zw6.png)
---
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c52nj4ibpyyp7yaj5zw6.png)

Amazon WorkDocs is a fully managed, secure content creation, storage, and collaboration service. With Amazon WorkDocs, you can easily create, edit, and share content, and because it’s stored centrally on AWS, access it from anywhere on any device. Amazon WorkDocs makes it easy to collaborate with others, and lets you easily share content, provide rich feedback, and collaboratively edit documents. You can use Amazon WorkDocs to retire legacy file share infrastructure by moving file shares to the cloud. Amazon WorkDocs lets you integrate with your existing systems, and offers a rich API so that you can develop your own content-rich applications. Amazon WorkDocs is built on AWS, where your content is secured on the world's largest cloud infrastructure.

With Amazon WorkDocs, there are no upfront fees or commitments. You pay only for active user accounts, and the storage you use.

## Benefits
* Migrate your on premise file servers and reduce costs significantly
* Securely share with internal teams and external users in real-time
* Secure your content in the cloud
* Bring content into your applications and processes
* Route your documents using approval workflow
* Extend your desktop to the cloud

Some of the use case of the Amazon WorkDocs is in helping to replace expensive legacy file sharing services. This system are mostly referred to as ECM solutions. With Amazon WorkDocs, you can easily migrate existing content from legacy network file shares to the cloud and your users can continue to access all their individual and team’s shared content from their native desktop file systems through WorkDocs Drive, or through the web user interface or mobile application.
How to Install Open-WC on Windows
Published: 2021-08-29 21:48:17

#Open-WC 
This is a tutorial on how to install Open-WC on Windows and will cover IDE setup, Node.js/npm setup, yarn, and an open-wc boilerplate. Let's get started!

#Step 1: IDE
In this tutorial, we will be using VSCode. To install VSCode use [this link](https://code.visualstudio.com/download) and download the correct version for your computer. If you are unsure which bit option to download, press the Windows key and search system information to figure out which is the right one for your setup.

#Step 2: Node.js & NPM

Use [this website link](https://nodejs.org/en/download/) and download the latest LTS version of Node.js that corresponds to your 32 or 64-bit processor.
 
Once the setup wizard finishes installing this onto your computer, if you want to confirm which version downloaded, open up the terminal/command prompt or Windows PowerShell and enter the following:
`node -v`

NPM should also have been downloaded, to confirm the version installation enter the following:
`npm -v`

#Step 3: yarn

In order to install yarn we will be utilizing npm. Open the terminal and enter the following:
`npm install -g yarn`

#Step 4: Open-WC Boilerplate

Open your terminal and navigate to the location/folder where you would like to create this project. Once you are in the desired folder, enter the following:

`npm init @open-wc`

Once complete you should see this:

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

Press enter to select *"Scaffold a new project"*.
Press enter to select *"Web Component"*.
Use the spacebar to select all three options *"Linting"*, *"Testing"* and *"Demoing"*, then press enter.
Press enter to select *"No"* for typescript.
Now set the name for your project, in my example I used *"hello-world"*.
Press enter to select *"Yes"* to write the file to disk.
Now select *"Yes, with yarn"* and press enter in order to install dependencies (this part may take a while).

Once installation is complete, there should be a message that says *"You are all set up now!"*.

In order to confirm successful installation and setups, enter the following:
`cd hello-world`
`npm run start`

Once entered, a browser should pop up with this
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h6sjl24g5fwzbqralwwq.png)

Congrats! You have successfully installed Open-WC on Windows.
Installing open - wc on Mac
Published: 2021-08-29 21:47:17

#What you will need

1. Mac computer with administrative rights
2. NodeJS/NPM 
3. VSCode IDE

#Step-by-Step

Once you have downloaded and installed the correct versions of NodeJS (https://nodejs.org/en/) and the VSCode IDE (https://code.visualstudio.com/download) on your computer, create a folder on your desktop and name it something applicable to the projects you will be working on. For the sake of the tutorial, I will be naming it "projects". Once your folder is created, 'Ctrl' + click on it and select the setting "New terminal at folder" to access the terminal. 

Once the terminal is open, enter the command:

**npm install -g yarn**

followed by

**npm init @open-wc**

If errors occur with either input, type "sudo" followed by the command that was displaying an error. 

Example: 

**sudo npm install -g yarn**

**sudo npm init @open-wc**

Once you are prompted with the screen that displays Open Web Components Recommendations:

Use the arrow key to navigate towards the option that says "Scaffold a new project"

Once you have selected it, you should then select "Web Component" to Scaffold

At the next prompt, use your spacebar to toggle each of the options Linting, Testing and Demoing using your arrow key to select each

When prompted if you would like to use typescript, select "No"

When asked what you would like to name your web component, input "hello-world" exactly

When asked if you would like to write the file structure to the disk, select "Yes"

When you are prompted with the option to install dependencies, select the option "Yes, with yarn"

If done correctly, your screen should display a message that says "You are all set up now!"

All you will need to do from there is run the command **cd hello-world**, followed by **npm run start** to launch your browser.
100 days of hacking
Tags: security, 100daysofhacking, selfimprovement
Published: 2021-08-29 21:41:55

---
title: 100 days of hacking
published: true
description: 
tags: #security #100daysofhacking #selfimprovement
//cover_image: https://direct_url_to_image.jpg
---
*🇧🇷[Read in Portuguese here](https://camila.dev/100-dias-de-hacking)*

The #100daysofCode challenge was created by [Alex Kallaway](https://twitter.com/ka11away) when he decided that he wanted to become a better programmer. In order to do that, he made a public commitment to code for 100 days in a row, thus helping him to create a new habit. By sharing about his challenge daily, he ended up encouraging a lot of people to do the same and created a movement of people looking for self improvement that goes beyond coding. 

Today this movement encompasses several others challenges in the #100DaysOfX, like one hundred days of reading, exercise, foreign languages and even the one hundred days without (#100daysWithout) to help people looking to quit a habit.

It's proven that making a public commitment improves people’s ability to stick to changes and create new habits. This works very well with me: when I make a commitment with someone it's very important to me to keep what I promised. Even if no one is looking or asking me for updates, if I make a commitment I feel obligated to go all the way.

This is a great thing, especially if you don't stick to your plans or projects for long like me. That's why I decided to start this challenge to encourage myself to learn more about what I've been most interested in lately: Hacking!*  🎉

My interest in hacking started a long time ago, but only now I decided to overcome my fear and really learn more about the subject. My sister says something that makes a lot of sense: "When you put yourself in motion things happen". 

And it really happened: when I started to learn more about the subject and follow people that talked about hacking some really cool things started to happen, one of them was being selected to participate in the Bugcrowd Mentorship Program. Bugcrowd is a cybersecurity platform where companies have their bug bounty program to encourage security researchers to test their systems and identify vulnerabilities. 

It has being a great learning opportunity, but sometimes work, life and other things gets in the way and I end up not prioritising my hacking studies. So the focus of  my 100 days of hacking will be to study, practice and look for security vulnerabilities in web applications. 

**Motivations**: 

- Be able to track my learning progress.
- Make better use of the opportunity to be part of the Bugcrowd Mentoring Program.
- An opportunity to practice what I've been wanting to do for a while, which is to write more.

**Rules**
- Monday to Friday: study for 1h (theory + practice in labs)
- Saturday and Sunday: Bug hunting for 2 hours
- Write a blog post about what I learned in the week.

Goal at the end of the 100 days: **find a valid bug 🐞**         


**By hacking I'm referring to Web Application Hacking, there are other types but my focus is this one.*  
**I'm also referring to ethical hacking*
Open-wc
Published: 2021-08-29 21:31:54

# Creating an Open-wc Boilerplate #

**Downloading an IDE(Visual Studio Code):**
[Link] https://code.visualstudio.com/
Click on the link above to download Visual Studio Code
The program will ask for permission before downloading. Grant permission and follow the directions within the program.

**Install Node.js:**
[Link] https://nodejs.org/en/
Select Node TLS version (14.17.5)
Wait for file to download and then open and follow instructions
After installation you can run the command "node -v" to check what version you have downloaded. If you get version 14, you are all set!

**Download npm or yarn:**
Npm should be included with node.js
[Link] https://yarnpkg.com/ for more information
Open the command prompt on your computer
Type in “npm install -g yarn” to get started with install
*Optional* Type in “yarn set version berry” to download all versions of Yarn from 2 onwards
*Optional* Type in “yarn set version latest” to update to the newest versions

**Creating the open-wc boilerplate:**
Type in the command: npm init @open-wc
Select a new project scaffold
Select a web component
Check the option that includes linting, testing, and demoing
Select “do not user typescript”
Name file “hello-world” ** make sure everything is lowercase**
Select to install using yarn
How to create a Reactjs Project with Vitejs and TailwindCSS?
Tags: vite, react, tailwindcss
Published: 2021-08-29 21:29:35

### 1. The first thing we shoud do is create our react project with vite:

With NPM:

```bash
$ npm init vite@latest
```

With Yarn:

```bash
$ yarn create vite
```

### 2. After that, we need to install the dependencies:

With NPM:

```bash
$ npm i
```

With Yarn:

```bash
$ yarn
```

### 3. After that, we need to install TailwindCSS:

With NPM:

```bash
$ npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
```

With Yarn:

```bash
$ yarn add -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
```

### 4. We need to create a config file about TailwindCSS and PostCSS
We need to run this in our project:
```bash
$ npx tailwindcss init -p
```

In the generated file, we add these lines:
Purge is crucial for us if we want to use JIT (The new just in time compiler of TailwindCSS).
```jsx
module.exports = {
  purge: ["./src/**/*.{js,jsx,ts,tsx}", "./index.html"],
  mode: "jit", // Just in time compiler
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {},
  },
  variants: {
    extend: {},
  },
  plugins: [],
};
```

### 5. After that, we'll add the directives in the index.css of our project.

```css
/* src/index.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
```

### 6. Make sure you have the index.css imported in the index.js, if you don't have it, you have to add it.
```jsx
// src/index.js
  import React from 'react';
  import ReactDOM from 'react-dom';
	import './index.css';
  import App from './App';
  import reportWebVitals from './reportWebVitals';

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

  // ...
```

## ¡And that's all!, enjoy Tailwind CSS now 😀.
"npm" Command Cheat Sheet
Tags: npm, firebase, angular, node
Published: 2021-08-29 21:21:57


Welcome back to a new blog post. Throughout my uses of npm and creating applications in angular, I have found a set of commands that I keep coming back to to use again and again. While they're all used very commonly, it might be heard to remember them all of the time. So without any further ado, here they are for your convenient use! Hope it helps.

#### To install node.js

```
 # To install node.js
 # Install from the below official download link.
 # https://nodejs.org/en/#download

```

#### To install typescript

```
# To install typescript
npm install typescript -g

```

#### To install angular CLI

```
#  To install angular CLI
npm install @angular/cli -g

```
#### To check angular version

```
# To check angular version
ng version

```

####  To check the existing installed paths of node.js

```
# To check the existing installed paths of node.js
where node

```

#### To create new angular app

```
# To create new angular app
ng new <app_name>

```

#### To create module

```
# To create module
ng g module <module_name>

```
#### To install dependencies

```
# To install dependencies
npm install

```
#### To run or serve app

```
# To run/serve app
#To serve app => cd to the app folder and run
#Note:- npm start also will call ng serve and start the application.
ng serve

```
#### To create service

```
# To create service
ng gnerate service service_name

```
#### To generate interface

```
# To generate interface
ng generate interface git-search

```
#### To install latest AngularFire and Firebase for latest Angular CLI 7.x

```
# To install latest AngularFire and Firebase for latest Angular CLI 7.x
npm install firebase @angular/fire --save

```
####  To skip/avoid long path in terminal (shortcut)

```
# To skip/avoid long path in terminal (shortcut)
prompt $$

```
### Thanks for reading this post! 

I hope this article is informative and helpful in some way. If it is, please like and share this article. 

Happy learning!
IST 402 Introduction
Published: 2021-08-29 21:21:52

Hi my name is Delaney Kendrick. I am a senior majoring in Cybersecurity Analytics and Operations. I am interested in web development because I enjoy programming and I would love to learn more languages. I have learned about web development when I had a mentor during one of my internships who showed me his project work as a web developer. I am rather beginner with most languages and I would love to further develop my coding skills.
What is Amazon Lightsail
Tags: aws, lightsail, begineers, networking
Published: 2021-08-29 21:11:22

---
title: What is Amazon Lightsail
published: true
description: Amazon Light Sail
tags: aws,lightsail,begineers,networking

//cover_image: https://direct_url_to_image.jpg
---
In Simple Word It's your ***VPS Server*** Managed By AWS.

Lightsail is an easy-to-use virtual private server (VPS) provider that offers you everything needed to host your application or website with a cost-effective, monthly plan.

Why Lightsail is so Coool..
Because, you have nothing to managed. Just Choose an Operating System and Package from a available list and you are good to go.

https://lightsail.aws.amazon.com/

When you First time visit Lightsail
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m4h4op9n7w8kjb5js04n.png)
Click let's Get Started.
Lightsail Currently Support ***Two*** Major Operating Systems and
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2injprwidhr2qa9uj0jy.png)
 
28 Different Packages.
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0l5dkz9r1jsmj3v7lphj.png)

#### For Which Case Amazon LightSail Suitable for ?
- Simple web applications
- Websites
- Business software
- Dev/test environments
- Other Hobby Projects
- Most Important When you don't want to manage anything 😋😎

What Features LightSail Provide?
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/299xw6d94h7hbqp7l7xw.png)
- You Can Create Instances (Servers)
- You Can Create Containers
- Create Separate Database for your Applications.
- Load Balancers
- CDN
- DNS
- Domain Attach
- You Can Take Snapshot and Restore Anytime (Backup your servers)
- High availability (for stability and redundancy)
 
 
Amazon LightSail Provides 750 hours free
per month for 3 months with the AWS Free Tier. 😊😊

You Can Choose any preconfigured stacks and lunch it by only one Click 😉 
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h1e05wnnggvhiu6djlo6.png)
IST 402 Intro
Published: 2021-08-29 21:10:59

#Introduction

Hi, my name is Elizabeth Meier and I am a senior at Penn State majoring in Human-Centered Design & Development with an application focus in Data Sciences and a minor in Chinese. Around campus I'm involved in the Penn State Blue Band as well as president of my sorority. Although I have not had any official internships, I volunteered my technical and design skills for a couple nonprofits where I gained valuable experience. This summer I was fortunate enough to be offered a full-time job at EY where I will start working once I graduate in the Spring! 

#Why Web Dev
I am interested in web development because I am always looking to learn and improve my coding skills. While I have a little bit of experience with JavaScript, I believe it is my weakest coding language and I am eager to improve as I think it will be beneficial later in my career. Additionally, I enjoy front-end development a lot because of the opportunities for creativity. I also am looking forward to getting more experience with GitHub throughout the semester.
IST 402 - Introduction
Tags: introduction
Published: 2021-08-29 21:06:15

#Background 

My name is Frank Palmeri and I am from Long Island, New York. Over the past three years as an Information Sciences and Technology major at Penn State, I have completed courses covering a wide variety of topics such as application development, human centered design, database configuration, enterprise systems integration, and many others that have provided me with an insight on the various ways in which humans interact with technology. Through working on a diverse set of projects, I have been able to learn multiple programming languages such as Python, Java, and SQL that I am able to use on future projects. Over the summer, my internship with Penn State provided me with the opportunity to collaborate on projects pertaining to information security, data migration, and project management that will have allowed me to further expand upon my skillset in the technology space. 

#Why web development?

As online exposure quickly becomes a metric in which a businesses success can be measured, it goes without saying that web development is a commodity that increases in demand by the day. As I have learned many skills throughout my academic career that have become a prevalent part of business transactions and operations, learning JavaScript will provide me with the ability to create functional tools and websites that will allow me to add to my portfolio of work and expand upon my knowledge of the industry. I look forward to learning new skills throughout the semester and completing some new projects in this class.
What made you smile this week? 😋〽️⭕⭕
Tags: programming, webdev, php
Published: 2021-08-29 20:59:52

This week my channel finally hit that 350 subs 😂😎.... It is baby steps but anyway still progress 👍... My focus will now shift to high quality content creation plus a dive into app development ♌. For those who think I plan on quitting. Think again😏.

Here's the beloved channel link 👇👇

https://youtu.be/lxypbHEqWK0
LeetCode 128. Longest Consecutive Sequence (javascript solution)

Tags: algorithms, javascript
Published: 2021-08-29 20:46:16

###Description:
Given an unsorted array of integers nums, return the length of the longest consecutive elements sequence.

You must write an algorithm that runs in O(n) time.

###Solution:
Time Complexity : O(n)
Space Complexity: O(n)

```javascript
var longestConsecutive = function(nums) {
    // Handle base case of empty array
    if (!nums.length) return 0;
    
    // Give ability to look up nums by value
    const set = new Set(nums);
    let max = 0;
    
    for (const num of set) {
        // Make sure we are starting at the beginning of the sequenece
        if (set.has(num - 1)) continue;

        let currNum = num;
        let currMax = 1;
        
        // Look numbers that make a consecutive sequence
        while (set.has(currNum + 1)) {
          currNum++;
          currMax++;
        }
        // Update max
        max = Math.max(max, currMax);
    }

    return max;
};
```
The CSS 'Scrabble' writer — The next gen typewriter
Tags: css, html, webdev, codepen
Published: 2021-08-29 20:42:29

Get tired of the classic typewriter and its blinking caret? I am here to the rescue with my 'Scrabble' writer. A new and innovative way to type your text. 

Impress your visitor with such unexpected animation!

![CSS scrabble writer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c2uetxrjcw02jei2sdbv.gif)

### [See the Demo](https://codepen.io/t_afif/pen/vYZNVPX)

The HTML code is pretty basic and all you have to do is to adjust a CSS variable (for the number of letters) and the `font-size`:

```html
<span class="scrabble"><span>CSS</span></span>
<span class="scrabble"><span>is</span></span>
<span class="scrabble animate" style="--n:5"><span>crazy</span></span>
```

You can easily animate any text you want:

{% codepen https://codepen.io/t_afif/pen/MWoaxNa %}

<sup>PS: click on the "rerun" button to see the animation again</sup>

----

A quick overview of the previous events:

@alvaromontoro started the war with his CSS-only typewriter:

{% post https://dev.to/alvaromontoro/typewriter-effect-with-css-38im %}

I replied with my "simple-code" implementation

{% post https://dev.to/afif/a-scalable-css-only-typewriter-effect-2opn %}

He strike back with a cartoon 0-element version

{% post https://dev.to/alvaromontoro/animated-no-element-typewriter-2835 %}

Another warrior (@auroratide) is trying to defeat us with an SVG version!

{% post https://dev.to/auroratide/a-typewriter-but-with-no-html-css-or-js-1bgd %}

But, I am here with my secret weapon: **the Scrabble writer!**

![to be continued](https://media.giphy.com/media/X5wqqXmtbttG121WMy/giphy.gif?cid=ecf05e47jnr1ayqczx022cegqu9xawicym7361sdd8xiidct&rid=giphy.gif&ct=g)