teleren/devto huggingface dataset:
i am new to nodejs and installed it. But npm start command is not success for me. It is showing the errors
Published: 2020-10-14 14:35:15


C:\Users\Om Namah Shiavay>npm start

> reactjs@1.0.0 start C:\Users\Om Namah Shiavay
> webpack-dev-server --mode development --open --hot

internal/modules/cjs/loader.js:834
  throw err;
  ^

Error: Cannot find module 'webpack'
Require stack:
- C:\Users\Om Namah Shiavay\AppData\Roaming\npm\node_modules\webpack-dev-server\
bin\webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:831:15)
    at Function.Module._load (internal/modules/cjs/loader.js:687:27)
    at Module.require (internal/modules/cjs/loader.js:903:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (C:\Users\Om Namah Shiavay\AppData\Roaming\npm\node_mo
dules\webpack-dev-server\bin\webpack-dev-server.js:12:17)
    at Module._compile (internal/modules/cjs/loader.js:1015:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1035:10)
    at Module.load (internal/modules/cjs/loader.js:879:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js
:60:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\Users\\Om Namah Shiavay\\AppData\\Roaming\\npm\\node_modules\\webpack-d
ev-server\\bin\\webpack-dev-server.js'
  ]
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! reactjs@1.0.0 start: `webpack-dev-server --mode development --open --ho
t`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the reactjs@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to in
stall?

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Om Namah Shiavay\AppData\Roaming\npm-cache\_logs\2020-10-1
5T13_59_23_200Z-debug.log
npx create-react-loaded
Tags: react
Published: 2020-10-14 14:34:01

## React Templates

So you may be aware I've made a huge amount of templates across several frameworks using my merced-spinup tool, but for certain templates I give them their own tool cause I expect many want to use them.

For react I have create a tool for a very basic build that you can customize that comes in at half the size of create-react-app, the commands for this build are.


```npx create-react-basic folderName```



```npx merced-spinup reactbasic folderName```

Today I'm looking to discuss a new template I made with a more robust set of tools out of the box. The commands for this React template are as follows.


```npx create-react-loaded folderName```



```npx merced-spinup reactloaded folderName```

## React Loaded Features

### Sass

You have the ability to use sass files for styling, there is already a global sass style sheet in the src folder.

### Router

Router is installed and a couple sample pages in a pages folder.

### GlobalState

A custom components and hook was made to make global state management even easier. In the gstate.js file you can alter the initialState and the reducer.

In the app.js file, the GlobalState component which wraps the App components provides the state object and dispatch function to the entire application.

import the useGlobal hook from gstate.js into any file to easily pull the state and dispatch into that component.

### Custom Hooks

In customHooks.js there are a couple of custom hooks.

**useFetch:** Pass the url you want to fetch and it returns an array with the data from the fetch and a setUrl function. Everytime you use the setUrl function it will remake the API call and update the data.

**useAdjuster:** takes a starting a value and an interval. Returns and array with the value and two functions that will increment and decrement the value by that interval.

### Pre-made Components

In utility.js there are several premade components that customizable externally and you can customize in the file for Buttons, Modals, Carousels, Containers, FlexContainers, and Cards. All of these should be running on the default page as an example. There is also a pre-made header and footer component.

## Bottom Line

Using the create-react-loaded supercharges with lots of customizable pre-configured tools to get you up and running in building your React app.
[Video] TDD in 10 Minutes ⏲
Tags: tdd, testing, beginners
Published: 2020-10-14 14:33:11

---
title: [Video] TDD in 10 Minutes ⏲
published: true
description: 
tags: tdd, testing, beginner
//cover_image: https://direct_url_to_image.jpg
---

I don't regularly make videos, but some time ago I gave it a spin. I decided to make a video demonstrating and explaining TDD in right around 10 minutes.

I think its really important that people SEE it happen if they want to decide if it is something that can work. Anyway, hope you enjoy!

{% youtube waQy0k-6JF0 %}
ServerLab a Server Unit Testing Framework OSS
Tags: powershell, testing, framework
Published: 2020-10-14 14:21:41

---
title: ServerLab a Server Unit Testing Framework OSS
published: true
description: ServerLab helps with unit testing server images
tags: powershell, testing, framework
cover_image: https://github.com/kodaman2/ServerLab/blob/main/Docs/images/PesterRanExample_.png?raw=true
---

Photo: The tool was called TS_Images internally due to our naming conventions. I changed the name to something more suitable, but most of the file naming convention stayed the same.

On my way to work listening to the [Changelog Podcast](https://changelog.com/podcast/415) I learned how spotify open sources some of their internal tools to benefit the world. I've been meaning to do the same with `ServerLab` a tool I built for unit testing server images but had gotten lazy until now. Knowing that my tool could help people push me over the edge to publish it as open source.

https://github.com/kodaman2/ServerLab

Here's some [background](https://github.com/kodaman2/ServerLab/blob/main/Docs/Background.md) story if you're interested, how it got started.

I didn't think it was solid until some recent changes.

This is how the tool evolved over a period of almost a year.
Recap:
- v1 one script, good (2019 NOV)
- v2 configurable but still with some drawbacks, great (2020 MARCH)
- v3 configurable, maintainable and able to swap modules on the fly, super saiyan 4 (2020 OCT)

It is highly configurable, and saves time which is always a plus. v3 was also done in part to multiple people using the framework from IT to OT, and a few of my coworkers also giving me a hand to meet deadlines. I had to step up my documentation as I was no longer a one man army.

Let me know what you think of it, and please leave feedback or bugs in the repo.
IAM in AWS
Tags: aws, iam, cloud
Published: 2020-10-14 14:15:26

After covering the IAM section in the Certified Cloud Practitioner course, I thought it would be helpful to others and myself to briefly summarize what I have learned about it!

IAM stands for Identify and Access Management. It enables you to manage access to AWS services and resources securely. Using IAM, you can create and manage AWS users and groups, and use permissions to and allow and deny their access to AWS services.

Users in IAM are people within your organization. IAM gives you the ability to group users with a group name. Users are not required to be grouped, however it does help with organization! When grouping users, you are given the option to set policies/permission to that group. For example, if you have an Admin group, you might attach the  “Administrator Access” policy to that group. This would give any user in the Admin group Administrator Access for AWS services and resources. 

Policies in AWS are JSON documents that outline permissions for users or groups in your organization. In AWS, it is common to use the least privilege principle. The least privilege principle is that you do not give more permissions to a user than the user needs. 

Every user is required to have a password to sign into AWS. IAM allows you to set up a password policy for the users in your organization. The IAM password policy lets the organization:
- Set a minimum password length
- Require specific character types
- Allow all IAM users to change their own passwords
- Require users to change their password after some time
- Prevent password re-use
For extra security, IAM provides organizations to use Multi Factor Authentication for the root account and user accounts as well!

At first, IAM roles were a little hard to understand for me. Some services in AWS need to perform actions on behalf of the organization. To allow this to happen, we need to assign permissions to AWS services with IAM roles. What helped me understand this a little bit better was when I realized that an AWS service is like a user, it will need certain permissions. To assign permissions to a service we will need to use IAM roles. They are intended to be used not by physical people but by AWS services.

IAM also provides security tools for the organization and its users. An IAM Credentials Report is used for the organization( root account) which reports a list of all the users and the status of their various credentials in the organization. An IAM Access Advisor shows the service permissions granted to a user and when those services were last accessed. 
 
IAM is a pretty neat management tool that AWS provides. I think it is a great way to stay organized when your organization is scaling at a fast pace, it was interesting learning about it! Up next is a dive into the Elastic Compute Cloud (EC2)!
Learn Tailwind CSS with Tailwind Play!
Tags: tailwindcss, webdev, css
Published: 2020-10-14 14:02:01

No doubt you've heard great things about Tailwind CSS. Maybe you've told yourself that you want to try it out, but after looking at installation instructions, you've put it on the back burner.

With the introduction of Tailwind Play, testing Tailwind CSS has never been easier!

[Check out Tailwind Play here!](https://play.tailwindcss.com/) 

Tailwind Play is Tailwind's new online playground! It comes with a snappy IDE window and gives you full access to Tailwind's feature set - allowing you to even customize the `tailwind.config.js` file! 

Even if you aren't using Tailwind for production products, it has always been a great solution for quick prototyping and with the introduction of Tailwind Play, it's never been easier to get started! 


![Screen Shot 2020-10-13 at 11.55.40 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1602608162480/LVjjt2AE7.png)

### Benefits of Tailwind Play

- Full access to Tailwind features as if you had installed it in your own project
- Snappy IDE
- Hot-reload preview window
- Light and dark mode
- Autocomplete utility class-names
- Show off your work with the Share feature (generates unique link)


If you haven't already, be sure to check out  [Tailwind Play](https://play.tailwindcss.com/)  and let me know what you think in the comments below!
My First Online Fest
Tags: hacktoberfest
Published: 2020-10-14 14:00:32

## What I Learned From Hacktoberfest

I would like to thank @DigitalOcean @Intel @DEV for Organising this fest Hacktoberfest2020.
Well this gives me an immense pleasure in participating the HacktoberFest2020.

This Fest made me realise the importance of Helping other Developers also whatever the help you do ,small or big all of them are worth it!
Small Contributions make Bigger Things.

I am so happy that i am out of words now.
Thanks
[-1] University
Tags: webdev, codenewbie, react, career
Published: 2020-10-14 13:46:45

Since my previous post was more about my background, then in this one, I will talk about my current situation. At the moment, I am studying at the LAB University of Applied Sciences, which is located in Lahti, Finland. And yes, I’m learning information technology.


Lahti is located about a hundred kilometers from Helsinki, where I live at the moment. And it is not the biggest city, even by the standards of Finland. Anyway, they have quite a good university — https://lab.fi/en. And more importantly, they also have online degree program options, one of which I chose. So, I rarely have to physically go to the university. It’s very convenient if you need to combine work and study, and, for sure, it is also a brilliant choice for an introvert person like me.


So, I started studying about a year ago, in August 2019. The official name of my degree program is Information Technology. And after graduating, I become a Bachelor of Engineering.


The principal area of programming that I’m most interested in is web development. HTML, CSS, and JavaScript are the things that are inspiring me right now. In an ideal situation, I would like to develop in that direction and also find a job in that field.


Okay, it’s probably time to finish with the introduction and telling about myself. In the next posts, I will be more precise about IT-related topics.


P.S.


There below is a website with my minor newbie projects. I made most of them as a part of the courses (except the site itself), so there’s nothing particularly impressive in there so far. Even so, I will try to frequently update this site, as I improve my skills.


Original post 29.05.20 https://create-react-app.com/creare-react-app-blog/
Site https://proj.create-react-app.com/
GitHub https://github.com/villivald
ActiveRecord::Events - Awesome Gems
Tags: rails, ruby
Published: 2020-10-14 13:40:29

{% youtube TIR7YDF3O-4 %}

I _really_ like using timestamps over booleans, they add so much more free information compared to a standard boolean, plus they nicely avoid the issue of "What if a boolean field is nil?".

The [ActiveRecord::Events gem](https://github.com/pienkowb/active_record-events) really compliments using a timestamp as a boolean, as it adds the conventional methods & scopes.

In the video, I cover how to install it & give some example usage.
Toggle Password Visibility
Tags: html, beginners, forms
Published: 2020-10-14 13:24:44

For input types of 'password', browsers mark the user's input (typically by replacing the characters with asterisk '*'or dot '.') for security reasons. However, the user might want to confirm that his input in plain text, so there is the need for an option to toggle the password visibility.

#### Step 1: Create the HTML input tag [type= 'password']
```javascript
  <input type='password' id='password' />
  <p>
    Show Password
    <input type='checkbox' id='checkbox' />
  </p>
```

#### Step 2: Store selectors (Javascript)
```javascript
const myInput = document.querySelector("#password");
const checkbox = document.querySelector("#checkbox");
```

#### Step 3: Toggle visibility function
This checks toggles the input tag (myInput) type between *type password* and type *text* 

```javascript
const toggleVisibility = () => {
  if (myInput.type === "password") {
    myInput.type = "text";
  } else {
    myInput.type = "password";
  }
};
```

#### Step 4: Assign this function to the checkbox onchange event

```javascript
checkbox.addEventListener("change", toggleVisibility);
```
Checkout this [codepen](https://codepen.io/temmietope/pen/yLJYvYg?editors=1111) for the working code.

{% codepen https://codepen.io/temmietope/pen/yLJYvYg default-tab=js,result %}
Hacktoberfest : conheça os projetos open-source da WoMakersCode
Tags: hacktoberfest, opensource, womenintech, github
Published: 2020-10-14 13:14:34

---
title: Hacktoberfest : conheça os projetos open-source da WoMakersCode
published: true
description: Veja como participar da hacktoberest com os projetos da womakersCode
tags: #hacktoberfest #opensource #womenintech #github
---

Todos os anos, no mês de outubro ocorre a [Hacktoberfest](https://hacktoberfest.digitalocean.com/), um evento que visa engajar mais pessoas a contribuirem para o open-source (para participar basta se cadastrar no link deles acima), e nós da WomakersCode não iríamos ficar fora dessa!

Temos diversos repositórios públicos e abertos para contribuição no nosso Github, com conteúdos sobre Workshops, tutoriais, dentre outros. Queremos que cada vez mais mulheres aprendam com esse conteúdo e você pode ajudar elas e ainda enriquecer seu currículo contribuindo com opensource.

Não conhece muito sobre Git e Github? temos uma [série de posts](https://dev.to/womakerscode/instalando-configurando-e-inicializando-o-git-no-linux-2m96)  aqui sobre isso!

A seguir a lista de projetos abertos para contribuição:

Guia de git e github: https://github.com/WoMakersCode/git-e-github

Curso de banco de dados: https://github.com/WoMakersCode/banco-de-dados

Workshop de Pwa: https://github.com/WoMakersCode/pwa-workshop

Desafios de backend: https://github.com/WoMakersCode/challenges-back-end

Desafios de frontend: https://github.com/WoMakersCode/challenges-front-end

Desafios de lógica/algoritmos: https://github.com/WoMakersCode/challenges-algorithms

React-bootcamp: https://github.com/WoMakersCode/react-bootcamp


Em cada repositório temos uma lista de issues disponíveis e uma guia de contribuição, qualquer dúvida podem entrar em contato conosco!!

Vamos juntas!
DevDiscuss Review
Tags: discuss, dev, review
Published: 2020-10-14 13:14:06

https://dev.to/devteam/introducing-our-first-original-podcast-devdiscuss-53ej
DEVDISCUSS PODCAST REVIEW
This Podcast,changed the way I look at my career.
I am a high school student who has decided to take up Computer Science as a career,with little prior knowledge,I am riding on hardwork and opputurnity here.This podcast has created an indelible mark on the way I decide to take up this field as a career.
Thanks and more love to you guys!
Why do you need custom CRM development?
Tags: customdevelopment, crmsoftware
Published: 2020-10-14 13:13:07

Picking the right CRM software 💻 is one of the most important business decisions you can make. There are two options: build your own CRM or rent a ready-made software. Which option is better? 🤔 Figure out more details inside ⬇️ 
[Custom CRM development guide](https://apiko.com/blog/a-custom-crm-development/?utm_source=dev.to&utm_medium=crm-dev&utm_campaign=blogpost)
I want to increase my website's traffic
Tags: seo, content, marketing
Published: 2020-10-14 13:03:16

---
title: I want to increase my website's traffic
published: true
description: Sure, a spike in traffic is fun but quite insignificant in the long run. The truly sustainable and long-term growth in traffic to your website comes from search engines. So, focusing on SEO (Search Engine Optimisation) is the only reliable way to achieve it.
tags: SEO, content, marketing
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ydzawddmrpvwlucghp7a.png
canonical_url: https://2.flexiple.com/no-vc-reports/i-want-to-increase-my-websites-traffic
---
With 3.5 billion searches performed on Google with definite intent, SEO is the unequivocal answer to help bring relevant visitors consistently to your website and to convert them into your customers

 I breakdown the process into three steps:

1. **Building your website's reputation:** Without a good reputation, it is almost impossible to rank on Google. Guest posts are your best friend to build this.

2. **Keyword research and writing content:** The critical aspect is to never start writing an article without keyword research. Optimise your blog and use the tools mentioned in the report to make it easy.

3. **Distribution:** Just writing your blog doesn't guarantee ranking on Google. Distribute it across various platforms (included in the report), social media, and also a newsletter.

Then, keep repeating step 2 and 3.

I have shared many pro-tips, tools and important concepts in [today's report](https://2.flexiple.com/no-vc-reports/i-want-to-increase-my-websites-traffic). Do give it a read. Just 5 mins from your schedule - please :).

If you like the report, do support me on Twitter - your support will really help me :).

{% twitter 1316353407498645505 %}
API Tests Optimization - Reorganizing Tests
Tags: javascript, testing, api, automation
Published: 2020-10-14 13:01:16

So far in the previous posts, we wrote a few API tests for various HTTP methods and we were relying on the data that already existed on our test site. The challenge with that is if the existing data changes or gets removed it'll end up breaking our tests. Let's take a look at how we can fix that.

### **Current test structure**
This is how the tests have been structured so far:
```javascript
// GET Tests - uses existing userId to get the user data
// POST Test - creates a new user
// PUT Test - uses existing userId to update the user data
// DELETE Test - uses existing userId to delete the user data
```
So clearly with the `DELETE` test, we cannot run it multiple times as we are using existing `userId` and as a result, it would throw a `404` error.

### **Reorganize tests**
So we can fix the above issue by simply reorganizing the way we have written our tests. 
```javascript
// POST Test - creates a new user and stores a new userId
// GET Test - get the new userId from the POST test
// PUT Test - get the new userId to update the user data
// DELETE Test - get the new userId to delete the user data
```
What we did here is moved our `POST` test on the top to create a new user and then passed the `userId` to the rest of the tests. This way despite how many times we run this test file it'll always work unlike the previous set of tests. 🙌

Now, I know there's a downside to this also as all the tests are dependent on the first test but I'd rather prefer this over using existing data that we can't control. 🤷‍♂️

#### Check out this video to see a detailed explanation on how I reorganized the tests:

{% youtube Bz77JGEKRrk%}

You can also clone the [GitHub repo](https://github.com/automationbro/JavaScript-API-Automation-Tests) to access this code

***

#### To learn more about API testing, check out my free tutorial series here - 
https://www.youtube.com/watch?v=ZSVw3TyZur4&list=PL6AdzyjjD5HDR2kNRU2dA1C8ydXRAaaBV&ab_channel=AutomationBro
***

I hope this post helped you out, let me know in the comments below! 

Happy testing! 😄 

...

Subscribe to my [YouTube](https://www.youtube.com/channel/UCjugV5pnY6WjvTGYm7U1ucg?sub_confirmation=1) channel
Support my work - https://www.buymeacoffee.com/automationbro
Follow [@automationbro](https://twitter.com/automationbro) on Twitter
Season of Docs, Meeting-7
Tags: github, opensource, docker
Published: 2020-10-14 12:36:27

Due to COMBINE2020, this meeting did not take place. Though, via Email, I took a brief feedback with regards to the plugins page. 
I had corrected all the errors on the Plugins page, just a minor addition was left, that was to insert a graphic to the plugins page. I was unable to take care of this issue, due to my exams, but I hope to resolve it after I'm done with my exams.
In the next meeting, I hope to have a discussion, on how to take this project forward & I hope that I'll be able to cover up for the lost time.
Once again a **Special Thanks** to Prof. Myers, for understanding my situation regarding my exams and allowing me to focus on them.
Looking forward to the meeting on 14th of October!
Duplicate file finder with computerized plus human judgement
Tags: showdev, typescript, node
Published: 2020-10-14 12:34:33

In case someone want to reuse my code.

It involves

- Generating a SQLite file, and using it
- File extension comparison
- Filesize comparison up to 3 significant digits (`Number.prototype.toExponential(2)`)
- Generating SHA256 hash for more similarity sensitive files

I haven't yet put in computer vision for image similarities.

{% github patarapolw/dedupe %}