teleren/devto huggingface dataset:
Should you buy Macbook pro M1 2020
Tags: apple, m1, macbook
Published: 2021-01-20 09:40:40

---
title: Should you buy Macbook pro M1 2020
published: true
description:  
tags: #apple #M1 #macbook
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/x7rmyet87oudf4z9hlg7.jpg
---

I was using MacBook pro 16" 2020 model previously and it is a machine for developers.Anyways i needed a laptop for my day to day job which is coding and listening to some [coccolino deep](https://www.youtube.com/watch?v=TVqKU8KapcI) songs and i chose MacBook 13 inch M1 2020 model to be the lucky one.

All in all if i compare with **MacBook PRO i7** model it is a beast machine and just never lets me down in performance spectrum. 

Although i do have some pros and cons for you guys...

####PROS
* Battery performance
* 8 Core ARM architecture
* Big Small processor design used in M1
* Rest is same old same old

####CONS
* Software support
* Miss you docker
* Had to install brew in two separate locations 

---
>For all the developer wait for full software support but if you want to come join us M1 owners on the brighter side of rainbow please don't think twice **TAKE THE LEAP**
Project 35 of 100 - React Ecommerce PWA
Tags: pwa, react, javascript, 100daysofcode
Published: 2021-01-20 09:15:16

*Hey! I'm on a mission to make 100 React.js projects ending March 8th. Please follow my dev.to profile or my [twitter](https://www.twitter.com/jwhubert91) for updates and feel free to reach out if you have questions. Thanks for your support!*

Link to today's deployed app: [Link](https://100-react-projects-day-35-dolces-dollhouse-v3-launch.netlify.app/)
Link to the repo: [github](https://github.com/jwhubert91/100daysofreact/tree/master/day-35-dollhouse-ecommerce-launch)

###DISCLAIMER: 
The woman in the pictures on this site is a model. Pressing the chat button will not connect you with her. I'm surprised I have to say this. Anyway I have disabled the link. If you really want to buy women's accessories feel free to check back in a week when the domain is set up and the final style tweaks have been made.

Today I helped launch the PWA version of the beta draft of this eCommerce site directed at women's accessories for a client. This draft includes a nearly-perfect Lighthouse score and an offline page. The site is intended almost completely for mobile users, so it doesn't look quite as nice on a desktop.

To fulfill the PWA requirements I once again followed [this Javascript Mastery Youtube course](https://www.youtube.com/watch?v=4XT23X0Fjfk&list=PL4cUxeGkcC9gTxqJBcDmoi5Q2pzDusSL7&index=2&t=0s). 

For the slideshow effect I used the `react-slideshow-image` npm package and created a component with it. Each of these components were fed the images with props and an image array.

Let me know what you think!
Convert Kubernetes yaml to Helm Chart yaml
Tags: devops, kubernetes, docker, aws
Published: 2021-01-20 09:05:34


{% youtube ZZVXXEyEzAs%}

In this session on "Install WordPress using Helm Chart," we are going to see


1. How to convert a Kubernetes yamls into Helm chart yamls
2. First we will do Kubernetes deployment where we are going to create deployment.yaml and service.yaml
3. After Kubernetes successful deployment we are going to convert deployment.yaml into helm chart deployment.yaml
4. Next we need to convert service.yaml
5. Finally we need to update values.yaml of Helm chart
Mongoose
Published: 2021-01-20 08:49:03

Yes mongoose, but not animal. With mongoose you get superpower of interact with mongodb elegantly.
Some of the most important concept are model, schema and hooks.

Schema is actually representation of entities such user in the database. For example user can have name, username and any other field. Schema can not be used to interact with the database, instead we need to create the instance of it that is model.

The model is the instance of the schema, which you use to interact with the database and perform CRUD operations. Mongoose makes it easy to perform these operations by providing a simple and intuitive API.

One of the key features of Mongoose is support for middleware or hooks, which allows you to run certain code before or after a certain operation. For example, you can run code before saving a document to the database to validate it, or you can run code after saving a document to update another document.

Mongoose also supports a variety of datatypes, including strings, numbers, dates, and arrays, making it easy to store complex data structures. Additionally, Mongoose has built-in support for population, which allows you to easily fetch related data from other collections.

In conclusion, Mongoose is a great tool for those who want to interact with Mongodb in a more sophisticated manner. With its simple API, built-in support for middleware and population, and variety of datatypes, Mongoose makes it easy to build powerful applications with Mongodb.
React Tree View using TailwindCSS/TypeScript/Storybook/Context API
Tags: tailwindcss, typescript, react, showdev
Published: 2021-01-20 08:20:31

I have built this simple project over the last couple of days. I wanted to build a simple tree view component for one of my projects I thought it might be a good idea to share it on Github so that everyone can have a look/review on it. I hope you like it:

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

Here's the source code: (https://github.com/SirwanAfifi/tw-tr)
Epicodus 1/20/21JavaScript & jQuery - 2
Tags: javascript, programming, codenewbie
Published: 2021-01-20 08:10:39

# **Terminology**

---

- **Function:** A function is a block of code that performs an action and returns a result; optionally takes arguments
- **Comment:** anything following `//` on a line in JavaScript is ignored by the computer. Comments are a convenient way to leave notes in your code for yourself or other programmers.

# **Functions**

---

- `alert()` opens a dialog box and returns `undefined`.
- `confirm()` opens a dialog box and returns a boolean.
- `prompt()` opens a dialog box and returns a string

# **Return Values**

---

![http://dl.dropboxusercontent.com/s/k9dngo7upljf8hs/function-arguments-returns.png](http://dl.dropboxusercontent.com/s/k9dngo7upljf8hs/function-arguments-returns.png)

An **argument** is what you pass into a function or method; a **parameter** is a variable that's assigned to the argument. In the example below, `number1` and `number2` are parameters while `1` and `2` are arguments.

### P**arts of a function**

- A **function declaration** starts with the `function` keyword.
- Next comes the name. It should be descriptive and clear. In the example above, the name is `add`. Always use lower camel case for function names.
- The name is always followed with parens. These parens may or may not include **parameters**. In the `add` function above, `number1` and `number2` are parameters.
- The function **body** is enclosed in curly braces. The code inside the curly braces is the code that will be executed when the function is called.
- Generally, you will want to `return` a value from your function. It's very common for beginners to forget the `return`, which means that the function will return `undefined` instead of a value. In the example above, the `add` function will return the value of `number1 + number2`.
Looking for blockchain Developer
Tags: blockchain, remote, ethereum
Published: 2021-01-20 07:16:39

At Oropocket we are looking for a blockchain developer. Kindly checkout the JD https://www.notion.so/Hiring-Blockchain-Full-Stack-Developer-09a2069f2618480096686fd225596769 and submit your resume over email to rohit.rai@oropocket.com
4 languages to learn in 2021 for app dev
Tags: android, mobile, reactnative, flutter
Published: 2021-01-20 06:39:07

since 2020 had alot of new languages on the rise , here are some of my choices :-
<ul>
<li>1. Dart - Flutter is getting popular day by day and it is a framework used by dart programmers . Dart has a very java like syntax . The learning curve is very easy and programmers can start building stuff within weeks .

</li>

<li>2. Javascript - Javascript has been the most popular language for atleast 10 years now . A Framework called react native is being used by a lot of programmers today . It is highly dependent upon react . It like flutter is used to create native applications ie applications that run on both android and ios with a single code base . Learning curve is easy when react is known .

</li>

<li>3.Kotlin- Even though its time for native dev's , android programming still remains at the top and kotlin having java like syntax has the easiest learning curve . 

</li>

<li>4.Swift - Fully ios dependable apps are created by swift . Learning curve is hard by the pay is also very competitive .

</li> 

</ul>
The Complete Guide to Partnering with an Offshore Development Team
Tags: offshore, development, outsourcing
Published: 2021-01-20 07:08:49

Hiring an offshore development team provides you with a wider pool of talent to tap for your projects. It reduces the need to hire new staff or retrain existing ones. This is just one of the many benefits of hiring an offshore development team. This article does a deep dive into all you need to know about partnering with an offshore development team.

Originally Published at : https://suyati.com/blog/how-to-find-right-offshore-development-team-to-partner-with/
Laravel Email Verification
Tags: laravel, php, tutorial, webdev
Published: 2021-01-20 07:01:57

By verifying the users' email, we can minimize the unwanted users on our application. In Laravel, we can easily implement this feature without even sweating a bit.

>Make sure your mail setting is configured 

## For `laravel/ui` or `laravel/breeze`

The first step is implementing the `MustVerifyEmail` interface to the User model like this:

`app\Models\User.php`:
```php
<?php

namespace App\Models;

use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;

class User extends Authenticatable implements MustVerifyEmail
{
   ... // Too Long For This Post
}

```

After that, assign the `verified` middleware to any route you want. For example, I assigned it to the existing `home` or `dashboard` route:

`routes\web.php`:

```php
...

// Laravel/UI
Auth::routes(['verify' => true]);
Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home')->middleware(['auth','verified']);

// Laravel/Breeze
Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth', 'verified'])->name('dashboard');

...
```

Now try to register a user. When it successfully registered, you will be redirected to this page because you aren't verified yet:

Laravel/UI:
![UI Verification](https://dev-to-uploads.s3.amazonaws.com/i/vhqerwvtiipup1xhms8w.png)

Laravel/Breeze:
![Breeze Verification](https://dev-to-uploads.s3.amazonaws.com/i/vo3ebo2ldd21ow3gno4p.png)


## For `laravel/fortify` or `laravel/jetstream`

Instead of implementing the `MustVerifyEmail` interface to the User model, Fortify or Jetstream has its own configuration in `config\fortify.php` file to enable the email verification feature:

```php
...

    /*
    |--------------------------------------------------------------------------
    | Features
    |--------------------------------------------------------------------------
    |
    | Some of the Fortify features are optional. You may disable the features
    | by removing them from this array. You're free to only remove some of
    | these features or you can even remove all of these if you need to.
    |
    */

    'features' => [
        ...

        Features::emailVerification(),

        ...
    ],

...
```

Then you should see a similar page in the jetstream app.

![Jetstream email verify](https://dev-to-uploads.s3.amazonaws.com/i/ozxg2xpmzhsmmfurz5zv.png)

But if you use only Fortify, you have to manually add the view as `resources\views\auth\verify-email.blade.php` and maybe the other required views as well. You can borrow from Breeze or Laravel/UI and It should be work fine.

That's for this useful feature of Laravel.

_________

versions used:
```
Laravel Framework: 8.x
```
It's normal to be awful at first
Tags: python, pandas, functional, datascience
Published: 2021-01-20 06:59:54

Back when I first started learning pandas for data analysis, I used to write awful code.

You could tell I am a newbie immediately by looking at my coding style.

I used to write a whole lot of nothing and complicate matters on myself while not harnessing the power of functional programming and the pandas API.

but you know what? this is normal, it should be like this, no one is born all-knowing, we gradually develop a style and a taste for our codes during our learning journey.

Here is how I write my code now:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0fx6nyyoe39igjara2up.png)


Just thought to share.
Web Development
Published: 2021-01-20 06:54:47

The main Divisions in web development are 
####![](https://upload.wikimedia.org/wikipedia/commons/6/61/HTML5_logo_and_wordmark.svg)

_**HTML**_: 
Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScript.
####![](https://upload.wikimedia.org/wikipedia/commons/d/d5/CSS3_logo_and_wordmark.svg)

_**CSS**_:
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.
The CSS specifications are maintained by the World Wide Web Consortium (W3C). Internet media type (MIME type) text/CSS is registered for use with CSS by RFC 2318 (March 1998). The W3C operates a free CSS validation service for CSS documents.

In addition to HTML, other markup languages support the use of CSS including XHTML, plain XML, SVG, and XUL.
####![](https://html5hive.org/wp-content/uploads/2014/06/js_800x800-619x619.jpg.webp)

_**JAVASCRIPT**_:
JavaScript, often abbreviated as JS, is a programming language that conforms to the ECMAScript specification. JavaScript is high-level, often just-in-time compiled, and multi-paradigm. It has curly-bracket syntax, dynamic typing, prototype-based object-orientation, and first-class functions.

Alongside HTML and CSS, JavaScript is one of the core technologies of the World Wide Web. JavaScript enables interactive web pages and is an essential part of web applications. The vast majority of websites use it for client-side page behavior, and all major web browsers have a dedicated JavaScript engine to execute it.
Why I Open-Sourced My eCommerce Apps
Published: 2021-01-20 06:36:41

Beginning in April 2020, I've built about 3 eCommerce Apps: 
 -  [Social King](https://apps.shopify.com/social-king)- [The Code](https://github.com/ElishaKay/social-king) 
 
 - [Scraper King & My Amazon History](https://github.com/ElishaKay/amazon_scraper_king) 
My initial goal with these apps was to monetize them as SAAS (Software-as-a-Service) Products. But, there were several factors that led me to open-source them.



a) Dragon Sickness
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7mk6gz5in0zy40d4q17p.jpg)
I started feeling like this:

No alt text provided for this image
This is a Screenshot from Lord of the Rings: the Hobbit Trilogy. The series is about a Dwarf King whose Gold Vault is infiltrated by a Dragon, and whose people is expelled by the Gold-Hungry Dragon.

So long as Thorin, the Dwarf King, is on a quest to reclaim the gold, he remains a moral man. But, the moment the Dragon is vanquished, Thorin gets Gold Sickness - an inability to part "with even one coin" & an unquenchable greed which can drive you to insanity.



2) Open-Source Accelerates Innovation
This week I watched "Revolution OS" - a documentary about the rise of Linux - the OS which led to the Rise of the Internet. There were 3 key Open-Source Projects which led to the internet becoming main-stream.

Linus Torvalds started Linux as an Open-Source project in 1991.
This led to the 1995 Release of the Open-Source Apache Web Server.
And in January 1998, NetScape Open-Sourced the Mozilla Browser



3) Leveling the Playing Field
At a time where retailers are getting hit hard, and eCommerce is accelerating, lots of Mom & Pop Shops and Small-Medium Sized Businesses can use a leg up to grow their businesses.


4) For me, it's More Fun To Teach
I've already made a Udemy Course on How To Build a Full-Stack Chrome Extension with NodeJS and MongoDB.

I'm currently in the process of building a new course on How To Build a Shopify App with NodeJS & MongoDB (*open-sourcing the Shopify App was a prerequisite to making the course).



5) Better Together
Coding is more fun in communities.

If you'd like to implement a Forum / Guest Blogging Platform on your own eCommerce Site, feel free to check out the Repos above. Currently, the Social Network codebase is specifically for Shopify-Powered Sites, but if more people want to get involved in the project, I'd be more than happy to port the features to any eCommerce Site.

Happy 2021🥂
Agile Metrics
Tags: agile, metrics, scrum, management
Published: 2021-01-20 06:13:55

[Scaled Agile’s first principle is taking an economic view](https://www.scaledagileframework.com/take-an-economic-view/) talks about 
achieving the shortest sustainable lead time with the best quality and value, we can attain that by measuring using Agile metrics.

**What are Agile Metrics and why is it important?**

The agile approach is based on the **iterative** and **incremental** software development principle, which means **the future work builds upon the previously done work (& feedback)**. 
*Agile metrics are the standard of measurement to see how productive a team is and to predict future work that can be done.* 
	

_**achieving the shortest sustainable lead time with the best quality and value.**_


**Below are the metrics I care about:**
1.	**Happiness Metrics**: Research suggests, happy people, give ~ 12% better output. To tap on that elusive 10-12%, I care about it. Happiness metrics can be introduced as part of the retrospective meeting and we can build a history.  It’s a holistic approach (more than retro) and opens up the forum for a bigger discussion. An article where I show to design one for your team. 
[**Happiness Metrics**](https://dev.to/swapanroy/happiness-index-57eo)

2.	**Capacity along with Velocity:** Resource Capacity, along with a steady velocity helps to plan for future sprints. Capacity shows the resource availability and steady velocity displays signs of a mature team, with which one can predict what work will be completed and when. An article which talks about agile capacity planning for sprints.
[**Agile Capacity Planning**](https://dev.to/swapanroy/agile-capacity-planning-5f7f)


3.	**Throughput and blockers:**  Throughput is the number of tasks completed within a given period (usually a sprint) and blockers are the impediment that prevents a task to be completed. This metric can be used for both New Projects as well as monitoring and support. I care about it as it tells why the task was not completed. It identifies a blocker, which can be dependent on a team, environment, or pending requirement clarification. **Throughput can be measured via story points or work in progress (WIP) items**. 

4.	**Cycle and Lead Time:** These metrics fall in the realm of monitoring and support projects. Cycle time is the time taken from when the task was requested when it was completed. Lead time is the time taken by the person to complete the task. I care about the cycle and lead time to see how well the task was understood, the skill level and efficiency of the person. 
Cycle time varies based on priority and amount of work still in the pipeline. If a team is managed properly, this metric can give a response to the business question of *“when will the work be completed ?”*.

*Did I miss some that I should care about?*
A homescreen mode for every mood in VS Code
Tags: webdev, vscode, productivity, programming
Published: 2021-01-20 06:08:50

Do you find yourself losing focus when you see the Hacker news feed, but want it a few minutes later when you're taking a break? If you use Marquee in VS Code, we released a new feature in version 1.3.0 that you need to know about. 

 > If you don't use Marquee, you should [install it now](https://marketplace.visualstudio.com/items?itemName=activecove.marquee). 

We now allow you to create and customize groups of widgets and quickly switch back and forth between them, depending on your flow-state. We know that some of the infotainment widgets can be distracting, so we made it easy for you to see exactly what you want, when you want it.

![Modes walkthrough](https://dev-to-uploads.s3.amazonaws.com/i/4wksyzb7k8dhar2756uv.gif)

As you switch back and forth, your dashboard and Marquee tree panel will instantly update to display content for the selected mode. Once you select a mode, all changes to size and positioning of those widgets will be saved so it stays just the way you want it.

We've provided a few default modes based on the widgets we think are best for working, or surfing infotainment, but it's really easy to create your own!

![Add modes](https://dev-to-uploads.s3.amazonaws.com/i/z0jwccr5lpfd9xaw3lr8.gif)

A few hidden gems include the ability to do a full reset using the vertical fly out on the modes configuration page, and the ability to duplicate any of your custom modes to quickly create and customize a new mode.

<table>
  <tr>
    <td><img src="https://dev-to-uploads.s3.amazonaws.com/i/fk8m9juxjsdm51u0t7hm.png" style="width: 100%;margin:0" alt="Reset modes"/><br><b>Reset</b></td>
    <td><img src="https://dev-to-uploads.s3.amazonaws.com/i/dj0kgia6wj2rz9vd9iit.png" alt="Duplicate modes" style="width:100%;margin:0"/><br><b>Duplicate</b></td>
  </tr>
</table>

![Marquee feedback](https://dev-to-uploads.s3.amazonaws.com/i/c9ig69cjjrdz549h8yy9.png)

Additionally, we've added a few options for getting in touch or providing us feedback. By clicking the feedback button in the navigation bar, you now get the option to open Intercom and chat with us in realtime or simply submit feedback with a form — the way you always have.

![Feedback walkthrough](https://dev-to-uploads.s3.amazonaws.com/i/azibyqy5uuzw45ys087g.gif)

Thanks for reading, and let us know what widgets you want next!