teleren/devto huggingface dataset:
How we cloned calendly with HTML, CSS, JS in 3 days.
Tags: calendly, html, css, javascript
Published: 2021-08-01 20:44:36

## Building a clone of Calendly.com

Hello there,
We were given a project to clone the website ‘Calendly’ as part of Masai School’s curriculum. In this blog I’m telling you the story of how me and my team made the clone website of Calendly.com.

## What is Calendly?
Calendly is a scheduling software, which aims to save time, accelerate sales, and improve service quality. It eliminates the old-school way of using email and phone tags for 
scheduling appointments, calls, interviews, demos, and more.

## How did we start the project?

We started with a team of Four members. I was responsible for managing GitHub repository. I created branches and assigned them to the respective persons.
So on the first day we decided to complete four pages, that is each one of us complete one page. And second day onwards we decided to start adding major functionalities like register, login and user profiles.

## Team Members:

* Shubham Rathod
* Hari Sanas
* Mahima Makkar
* Ajmal KV

## Tech Stack :

* Html
* CSS
* JavaScript
* Json

## Challenges:

We tried to implement a workflow where a user can surf the website, register and login, and create their own events. We faced some issues in responsiveness, styling parts, etc. But with the help of each other we solved all issues and at last we managed to complete the project before the deadline.

Some Snapshots of our project that we made:-

![calendly clone](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ptjvdlc1c2zvayhpxpdn.png)

![calendly clone](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xsiyqszgdgxxod2dslt6.png)

![login screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/15mjcrx0j8marrpq90pz.png)
JavaScript: Concept of Promise
Tags: codenewbie, beginners, javascript, tutorial
Published: 2021-08-01 20:42:44

Dear readers, this post is about a very useful and important concept of *JavaScript*. I think every beginner should have this basic knowledge while developing any project.

### What is a Promise

In JavaScript, `Promise` is a very important concept.The *Promise* object represents the eventual `completion` or `failure` of an *asynchronous operation* and its *resulting value*.

👉🏻 A *Promise* is a proxy with an *unknown value* whenever a Promise is generated. 
👉🏻 This allows the controller to connect with the final *success value* or reason for *failure* of the asynchronous operation.
👉🏻 This allows *asynchronous methods* to return the same values ​​as *synchronous methods*. 
👉🏻Instead of returning the final value *immediately*, the asynchronous method returns a promise to provide the value at a particular point in the *future*.

### Basic Syntax 

Promise is a *constructor function*, so we need a `new` to create a Promise. It takes a *function*, as it's *argument*, with *two parameters*: `resolve` and `reject`. 
The *syntax* generally looks like:

`const myPromise = new Promise((resolve, reject) => { } ) ;`

### States of a Promise

A promise has *three* states:

i) `pending`: It's the initial state, neither *successful* nor *unsuccessful*.

ii) `fulfilled`: It means that the operation was *completed successfully*.

iii) `rejected`: It indicates that the operation has *failed*.

#### Resolve Parameter

The `resolve` parameter is used when we want the promise to succeed. 

#### Reject Parameter
The `reject` is used when we want to catch the failure.

The following is an *example* of a *Promise*: 

```javascript
const makeServerRequest = new Promise((resolve, reject) => {
  let responseFromServer;

  if (responseFromServer) {
    resolve("We got the Data");
  } else {
    reject("Data not Found");
  }
});
```
In the code snippet, *responseFromServer* represents a response from the server.

If *responseFromServer* is *true*, the `resolve` method will be called to *successfully complete* the promise and return the string as it's argument. 
######(Generally, it returns data)

Again, if *responseFromServer* is *false*, the promise will fail and call the `reject` method.
######(Generally it catches the errors).
An open letter to my future self
Tags: devjournal, leadership, inspiration, encouragement
Published: 2021-08-01 19:51:15

Hey Max,

How's it going? I've been thinking about you a lot lately. Whenever I start learning a new skill or reinforce an old one, I think of you. Each time I get word that a company has decided to go in a different direction, you pop into my head. I know it isn't wise to get attached to a job you don't have, but I guess that logic hasn't stopped me from doing so. But when I think about you and how happy to you are at your job, I know that both of us are exactly where we are supposed to be.

I also wanted to write to tell you how proud I am of you. You kept going even when the going got tough. You took a thing that you thought was cool and you learned it and turned it into a career. You've surpassed anything that you thought was possible and continue to learn. You're getting that experience that I'm currently lacking and want so badly to have. That's amazing. I'm thrilled and again, I'm so crazy proud of you. You've (hopefully) found a great group of people to work with and to grow with and I hope that you are using your experience to help encourage others who are just starting out and feeling the way you felt. It is definitely hard to spend so much time with what at times seems like no payoff, but you realized that there is a payoff and it's worth the wait. I admire that.

There's a lot I can learn from you and at the end of the day, I guess that's kinda why I think about you so much. Eventually, I will just be a memory and I guess you'll be grateful for the journey I'm on. I need to remember that more. Hell, I have a lot to be grateful for now and as I sit here thinking about you, I'm becoming extra aware of that. I guess I owe you that too, so thanks for that too.

Anyway, thanks for sticking with it. I can't wait to catch up to you — I know you're doing amazing things!

Looking forward and working hard,

Max
Where to put regular expression checks?
Tags: regex, database
Published: 2021-08-01 19:50:26

Hello. I would like to know where should I check if a specific attribute matches with some regular expression. Should I do it in the class or in the database. For example imagine I have an **User** class, which has an email attribute, and I need to check if a given value for that property is correctly written. Also imagine I need to store the users in a database. Where should I check for the correctly written email, in the **code** inside the **User** class, in the **database** or **both**? Thank you.
The traits of a good code review
Tags: codereview, softwareengineering
Published: 2021-08-01 19:46:01

I've recently started a new software engineering role, and I performed my first code review a few days ago. If you don't know what a code review is, **it's an activity carried out by software engineers, and it consists of checking someone else's code and look out for any mistake**. When performing this activity, there are some aspects that you might want to consider to ensure that the code review is conducted successfully for you and your team members. Here is a comprehensive list of questions that you might want to ask yourself when performing a code review:

* Is the code efficient both in terms of runtime and memory? Is the code secure? Code efficiency is essential because we want the code to be highly performant and reliable. For example, you might want to look out for redundant code, ensure that errors and exceptions are handled consistently throughout the code. 
* Is the input validated correctly? Certain parameters can only accept specific inputs. For example, can we take negative values?
* Is there any more straightforward solution to the problem? It is a great software engineering practice to keep the code as simple as possible. You can look for the presence of multiple if statements, over-complicated patterns, complex loops, etc. Take any chance to make the code understandable and straightforward. 
* Is the code readable and well-formatted? Is the style consistent? Code should be written so that whoever comes later can easily understand what is going on. Check if variables are named appropriately, get rid of unnecessary spaces and tabs. Have a look at the pull request, and ensure that the code is always left cleaner than before. See if you can use better programming concepts to improve the quality of the code. Even the slightest improvement can make a massive difference.

A code review is a collaborative task that is beneficial to you and your team. Try to make it as constructive and pragmatic as possible. Give feedback with the intent to encourage improvement and explain why specific changes can benefit the code. 

I hope you've found this helpful!
Switch Windows Insider
Tags: windows
Published: 2021-08-01 19:32:27

I don't know from when moving from windows insider dev to beta programs can be done, previously I tried but couldn't, I just looked at the settings and it turns out that now it can, yeah.
![windows setting](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0ey17wx8gxbwf3cvg6ug.jpg)
Types of OOPs concepts in python
Published: 2021-08-01 19:26:58

###What is oops concept?
An object-oriented paradigm is to design the program using classes and objects. The object is related to real-word entities such as book, house, pencil, etc. The oops concept focuses on writing the reusable code. It is a widespread technique to solve the problem by creating objects.

###Types of oops concept:
-Class.
-Object.
-Method.
-Inheritance.
-Polymorphism.
-Data Abstraction.
-Encapsulation.

####Class:
The class inheritance mechanism allows multiple base classes, a derived class can override any methods of its base class or classes, and a method can call the method of a base class with the same name.

####Object:
The object is an entity that has a state and behavior associated with it.It may be any real-world object.

####Inheritance
Inheritance is a powerful feature in object oriented programming. It refers to defining a new class with little or no modification to an existing class.The new class is called derived (or child) class and the one from which it inherits is called the base (or parent) class.

####Method
A method is a function that “belongs to” an object.(In Python, the term method is not unique to class instances: other object types can have methods as well.

####Polymorphism
In Python, Polymorphism lets us define methods in the child class that have the same name as the methods in the parent class.In inheritance, the child class inherits the methods from the parent class.This process of re-implementing a method in the child class is known as Method Overriding.

####Data Abstraction
Abstraction in OOP is a process of hiding the real implementation of the method by only showing a method signature. In Python, we can achieve abstraction using ABC (abstraction class) or abstract method. ABC is a class from the abc module in Python

####Encapsulation
Encapsulation is one of the fundamental concepts in object-oriented programming (OOP).It describes the idea of wrapping data and the methods that work on data within one unit. This puts restrictions on accessing variables and methods directly and can prevent the accidental modification of data.
Kotlin monthly wrap-up: July 2021
Tags: kotlin, android, bestofdev, top7
Published: 2021-08-01 19:12:43

Hi, I'm Jean-Michel, a Kotlin fan like you! At the end of each month, I'll be showcasing some great posts, projects and insights from the Kotlin community, right here on DEV.to.

{% tag kotlin %}

Among the popular articles of the months, here are those I've read and can recommend:

---

How to get started with Android App Development? Rohit Kumar provides beginners with a roadmap of what to learn. Spoiler alert: there is a lot!

{% post https://dev.to/rohitk570/what-to-learn-to-get-started-with-android-app-development-19il %}

---

Next, there is my article who encourages you to write command-line tools to automate your workflow, but to make sure you use your favorite programming language, not Bash! Be sure to check my starter project for CLI tools in Kotlin multiplatform.

{% post https://dev.to/jmfayard/how-to-write-a-command-line-tool-with-kotlin-multiplatform-45g2 %}

----

Lists are the bread and butter of programming with Kotlin. Do you think you master them? [Sebastian Aigner](https://dev.to/sebastianaigner) comes back with an article and YouTube episode to explore what you may not know yet.

{% post https://dev.to/kotlin/exploring-kotlin-lists-in-2021-2gi %}

---

Finally, Christy Jacob presents what's new in Appwrite, an ambitious open-source alternative to Firebase in active development. That includes a Kotlin SDK both for Android and for server-side.

{% post https://dev.to/appwrite/announcing-appwrite-0-9-the-open-source-firebase-alternative-53ho %}

---

That's all for this month!

Remember to follow the Kotlin tag

{% tag kotlin %}

If you want to contact me, there is a standing invitation at https://jmfayard.dev/contact/.
Memoization in JavaScript
Published: 2021-08-01 19:11:21

Memoization is one of the crucial features of JavaScript. It improves the efficiency of your program and reduces CPU usage. It is used to store the result of a CPU-intensive operation. For example, if an operation takes 1ms of CPU. If we already have the result of the operation, we don't need to operation again and again.Accessing the result takes less time instead of calculating the operation again. e, g 0.5ms. We just saved 0.5ms of CPU time.
How MLH and BlahajGang helped me discover Tech
Tags: opensource, inclusion, python, productivity
Published: 2021-08-01 18:58:04

Before joining Blahajgang I was not sure what to do with my career but once I took part in INIT 2022 . I decided to join Blahajgang and it has been a wonderful journey ever since. Sorted my self out to make a career in ML/Data Science and hope to Make it to my dream country USA in 2-3 years time.Shoutout goes to Tiffany, Ashwin, Mike, Neel and Jack and other members of BlahajGang.

Blahajgang Discord:https://blahaj.lol/discord join me as I vibe with other BlahajGangers and hackathon dudes! 

Rico
Technical Writing Highlights from Large Orgs
Tags: documentation, technical, writing
Published: 2021-08-01 18:38:21

I've been reading through the style guides offered by larger tech companies. These summaries are a great place to start.

* [**Google** developer documentation style guide _Highlights_](https://developers.google.com/style/highlights)
* [**Microsoft** _Top 10 tips for Microsoft style and voice_](https://docs.microsoft.com/en-us/style-guide/top-10-tips-style-voice)
* [**Splunk** _A word about Splunk docs_](https://docs.splunk.com/Documentation/StyleGuide/current/StyleGuide/AwordaboutSplunkdocs)
* [**OpenStack** _General writing guidelines_](https://docs.openstack.org/doc-contrib-guide/writing-style/general-writing-guidelines.html)
* [**IBM** Developer Experience Guide: _Voice_](https://www.ibm.com/brand/systems/developer/brand/voice)
* [**Red Hat** _Style guide for product documentation_](https://redhat-documentation.github.io/supplementary-style-guide/)
* [**Gitlab** Style guide](https://docs.gitlab.com/13.12/ee/development/documentation/styleguide/)

My takeaway: concise, conversational, active voice, you can use second person, and Oxford commas FTW.
How I double my salary package in a year, Web designer to Python Developer.
Published: 2021-08-01 18:23:47

Hello guys, in this post I'll tell you about how I double my salary in a year.
I started my career as a web designer, I learned HTML, CSS, Js and PHP and MySQL, I my got my first job as a web designer on January 2020, they gave me only 9k/mo, my first salary was 9k INR only, and I travelled daily for 3 hours and after job I took the metro and come to home and rest for 5-10 mints and go to gym, because gym is very important. It helps me to reduce my stress and all anger, and after 3 months Corona virus is came and everyone knows that how dangerous it is, and in lockdown I applied for a new job and I got a job in lockdown as a web designer and that company gave me 15k/MO INR, then I started learning Python from YouTube, I learned python in 4months and I practice python at full night's and after python I decided to learn Django framework from YouTube and I learned Django in 2 months, and I practiced this for 2 months, and after that I applied for a new job and in December 2020 a company hired me in 18k/mo INR, and after this, but that company was fraud, and after this company I got job offer as a Django Developer and that company hired me in 25k/Mo, I worked there only for one month, because that was also a fraud company and I leave that company, and in that company there's no humanity they were very cruel, but after 2 weeks, I cleared a interview in an International company, and this company is a game changer for my career, they hired me as a Software Engineer and my package is 4.5 Lacs per annum, 32k/Mo. I just want to say one thing that always believe in God, God is everything ❤️.
Always trying, do work hard
and the most important thing be positive.
Move to the dark side of Vim
Tags: vim, linux
Published: 2021-08-01 17:56:48

#My Experience
When I started programming my code editor was Vscode, although I already knew of the existence of Vim I did not know its advantages. One night I decided to remove Vscode from my computer and install vim, more specifically Neovim. In this post I am going to show you the advantages of this code editor and how to install it on your computer.

##Advantages
At first Vim becomes complex to learn as you have many commands and keyboard shortcuts. But once you learn all these little things that make it difficult for this code editor and you become one with Vim you won't be able to come back from the dark side.

## Install Neovim in Linux
If you have another operating system you can see how to install Neovim on its official [website](https://neovim.io/)

###Ubuntu/Debian

```
sudo apt-get update && sudo apt-get install neovim
```

###Arch-linux

```
sudo pacman -Sy neovim
```

##Fedora

```
sudo dnf install neovim
```
To open neovim in terminal use the command `nvim`

## Configuration
To configure neovim you have to create the folder `nvim` in the path `~/.config/` 
Inside the nvim folder you have to create the `init.vim` file and in that file will go all your settings

## Installation
### Step 1
[Vim-Plug](https://github.com/junegunn/vim-plug)  is a module manager, which is used to install plugins.
To install it you have to run the following command in the terminal.
 
```
curl -fLo ~/.local/share/nvim/site/autoload/plug.vim --create-dirs https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
```

### Step 2

To install the plugins you must create the `plugins` folder in the directory `~/.config/nvim`
To add plugins to neovim you must write to the init.vim

```
call plug#begin('~/.config/nvim/plugins')

" here will go the plugins 

call plug#end()
```

![screenshot](https://gyazo.com/a218061b24f355c10a359ff18d8b0319.png)

### Step 3
Once the plugins are added restart neovim and in command mode you have to type 

```
:PlugInstall
```
Multiple Inheritance
Published: 2021-08-01 17:42:40

class Derived Class Name(Base1, Base2, Base3):
<statement-1>
.
.
.
<statement-N>
For most purposes, in the simplest cases, you can think of the search for attributes inherited from a parent
class as depth-first, left-to-right, not searching twice in the same class where there is an overlap in the hierarchy. Thus, if an attribute is not found in Derived Class Name, it is searched for in Base1, then (recursively)
in the base classes of Base1, and if it was not found there, it was searched for in Base2, and so on.
In fact, it is slightly more complex than that; the method resolution order changes dynamically to support
cooperative calls to super(). This approach is known in some other multiple-inheritance languages as
call-next-method and is more powerful than the super call found in single-inheritance languages.
Dynamic ordering is necessary because all cases of multiple inheritance exhibit one or more diamond relationships (where at least one of the parent classes can be accessed through multiple paths from the
bottommost class). For example, all classes inherit from object, so any case of multiple inheritance
provides more than one path to reach object. To keep the base classes from being accessed more than
once, the dynamic algorithm linearizes the search order in a way that preserves the left-to-right ordering specified in each class, that calls each parent only once, and that is monotonic (meaning that a class
can be sub classed without affecting the precedence order of its parents). Taken together, these properties
make it possible to design reliable and extensible classes with multiple inheritance.
Tired from react ? What about this library ?
Tags: javascript, react
Published: 2021-08-01 15:18:40

React is perfect for beginners because you can write JSX in that and the magic happens . you don't even need to refresh browser ! .
but although it's good for beginners , It becomes to big problem for intermediates and advances , because You should install a lot of dependencies and It isn't fast enough . 
So that's why that I made Panix.js .

## rendering
panix can render a simple h1 that contains "hello world" in 7-18 ms . so the syntax is like this:
```js
mount(node(tag , attributes , children) , parent)
```
node function , is a function that returns an object contains tag and etc. 
tag : should be an string like "h1" or "div"
attribute: should be an object like `{id:"main"}`
children : can be string or an array that contains more nodes like ` [node("h1",null,"hello"), node("h1",null,"goodbye") `
parent : the html element that the new element is going to insert in it .
## unmounting
you can unmount with unmount function :
```js
let el = mount(node("h1" , null , "hello"),document.body)
unmount(el)
```
## updating
sometimes you need to update something in an element . update function is here for this :
```js
let el = mount(node("h1" , null , "hello"),document.body)
update(el , node("h1" , null , "goodbye"))
```
interesting thing that update function will automatically insert new node inside the old node parent . 
this is how does update works:
![Untitled Document](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nsm0ivheayh2cxcxqk9j.png)
## last words

this [articles](https://dev.to/themarcba/coding-a-vue-js-like-framework-from-scratch-part-1-introduction-3nbf) helped me a lot  to understand virtual dom and code them . also the github repo is available [here](https://github.com/mehanalavimajd/panix) please star it and if you contribute
List websites for crypto jobs
Published: 2021-08-01 17:14:47

In this post I would like to make a list of websites that you can use to checkout job postings for crypto jobs. I will be adding more sites  to the list as I discover them.

 1. https://cryptojobslist.com/
 2. https://cryptocurrencyjobs.co/
 3. https://pompcryptojobs.com/
 4. https://angel.co/jobs
 5. https://crypto.jobs/
 6. https://cryptojobs.com/