teleren/devto huggingface dataset:
Laravel 8 Send Email Example

Published: 2021-04-30 15:01:57

In this example we will show laravel 8 send email example. we explain step by step laravel 8 how to send email.

This post you learn example of send email in laravel 8 smtp. laravel 8 provide mail class to send email.  we will learn send email in laravel 8.

In this example we will discuss full example of send email in laravel 8. laravel 8 provide Mail facade for mail send that have many method for send email. in this example i explain how to send emails from gmail account example.

[Laravel 8 Send Email Example
](https://web-tuts.com/laravel-8-send-email-example/)
The big 3 of array methods - map, filter & reduce
Tags: javascript, methods
Published: 2021-04-30 14:56:38

Hi there,
These array methods are the most important part of functional programming in JavaScript. I'm pretty sure if you're building a project in JS, you're gonna use atleast one of these, if not all.

So, let's get started!

Sample array:
`const arr = [2, 4, 6, 8, 10]`

##map()

It creates a new array with the results of calling a function for every array element.

```
const mapped = arr.map((element, index) => element * index);
//creates an array, multiplying every element of the original array with its index.

console.log(mapped);
// Outputs: [0, 4, 12, 24, 40]
```

##filter()

It creates a new array filled with all array elements that pass a test (provided as a function).

```
const filtered = arr.filter((element, index) => element % 4 === 0);
//creates an array, filtering the original array with elements divisible by 4. 

console.log(filtered);
// Outputs: [4, 8]
```

##reduce()

It reduces the array to a single value, executing a provided function for each value of the array (from left-to-right).

```
const reduced = arr.reduce((sum, current) => sum + current, 0);
//calculates sum of all the array elements

console.log(reduced);
// Outputs: 30
```
My First Lambda Labs Project
Published: 2021-04-30 14:41:13

###Background
For this project I worked with Boys and Girls Club which is an organization which provides voluntary after school programs for young people. They want to enable their club directors to provide support for struggling members. To solve this the project wast to create an emotion tracker web app in which students can scan an id card and tap an emoji representing how they feel. There was a lot of specifics that needed to be discussed and I was excited to jump in.

### Technical Dive
As a team we did a lot of planning during the first week of the project. We created user stories, wireframes, and our database model. 

The user story I decided to tackle first was the Club Directors ability to add members with a CSV file or individually. In the first stakeholder meeting I was able to discuss the feature more in depth and found they wanted to see the data before uploading.

The first problem I ran into is I did not know how to get javascript to read a CSV file. After doing some research I found out about [FileReader](https://developer.mozilla.org/en-US/docs/Web/API/FileReader). It allowed me to easily parse through a CSV file. I implemented this by creating an upload component that on change will read the CSV and add the data to a table.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gflqyplop9xvt898idna.png)

This solution worked, however I could upload any file type and it would attempt to read it and insert some interesting values into my table. To prevent this I created a simple if statement.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c2b3irz98deyoi2turj0.png)
Problem solved then right? Wrong! While testing a use case if I clicked upload and canceled out of it I  got an error. It  could not ready file.type of undefined. While the solution to this is easily solved it does show how important it is 
to test all use cases.

After many styling iterations the final model design was complete along with the CSV parser.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/flbxjl2uhfq0vgxdkq6s.png)

### Future of the project and reflection
I am really excited to see the development of this project. There is a lot of room for growth and adding new features. The actual emotional tracking could be done using a data science  modal based on emojis selected. Organizing and displaying data to the user will be a fun challenge.

I got some really good feedback from my teammates and learned a lot from peer programming. I really enjoyed working on this project as I used to go to Boy and Girls Club growing up. It  felt great to be able to push their goals.
📟 Updates to my autosched script to schedule posts with Hugo
Tags: bash, hugo
Published: 2021-04-30 18:53:59

---
title: 📟 Updates to my autosched script to schedule posts with Hugo
published: true
date: 2021-04-30 14:33:00 UTC
tags: 
- bash
- hugo
canonical_url: https://www.gozgeek.com/posts/2021/updates-to-my-autosched-script-to-schedule-posts-with-hugo/
cover_image: https://cdn.collinsoft.com/file/cdn-collinsoft/gozgeek.com/img/2021/laptop-coding/laptop-coding-2048x.jpg
---

A couple of weeks ago I posted [how I schedule posts with Hugo](https://dev.to/mrrcollins/scheduling-and-automating-posts-in-a-hugo-site-25c2). At the time, I had two scripts. The first one automatically selected the next day to schedule, while the other script let you pick the day. I’ve now combined the two. Here you go, the finished `autosched`:

```
#!/bin/bash

# Set these to where you want the posts to go and where you
# want to archive the posts
postsdir="${HOME}/Web/gozgeek.com/content/posts/$(date +"%Y")"
archive="${HOME}/notes/Archive/$(date +"%Y")"

RANDOM=$(date +%s%N | cut -b10-19)
h=$(( $RANDOM % 8 + 8 ))
m=$(( $RANDOM % 59 + 0 ))

# Only one argument was passed, the script assumes it's a filename
if ["$#" -eq 1]; then
    d=$(find ${postsdir} | xargs -I {} basename "{}" | sort -r | head -1)
    day=$(date -d "${d:0:10} + 1 day" +"%Y-%m-%d")
    filename="${1}"
# Two arguments - first is the date in YYYY-MM-DD format, the second
# is the filename
elif ["$#" -eq 2]; then
    day="${1}"
    filename="${2}"
else
    echo "Incorrect number of arguments"
fi

if [[${filename:0:1} == "2"]]; then
    outfilename="${day}-${filename:11}"
else
    outfilename="${day}-${filename}"
fi

schedule="${day}T$(printf "%02d" ${h}):$(printf "%02d" ${m}):00-04:00"

#echo "$postsdir $outfilename $schedule" 
# Put the file in the right place
cp "${filename}" "${postsdir}/${outfilename}"

# Add new schedule date and time
sed -i "s/^Date: .*$/date: ${schedule}/" "${postsdir}/${outfilename}"

# Remove Status
sed -i "/^Status: .*$/d" "${postsdir}/${outfilename}"

# Archive post
# My drafts are in a git repo.
git add "${filename}"
git mv "${filename}" "${archive}/${outfilename}"

echo "${filename} scheduled for ${day}!"

```
#100DaysOfCoding
Tags: 100daysofcode
Published: 2021-04-30 14:30:26

Hi Everyone —

After a long time, I have started my #100Day Challenge to do coding everyday & learn new things. This time I have chosen toe do in #React #Node #Express #MongoDB.

#Day1

On Initial day — I Had plan to have my database ready in cloud to get the API code started, for this one I have written #Node code using csvtojson library, which will help in reading the CSV file & convert to JSON. This can be used to load the data to #MongoDB using the mongoose library which worked perfectly.

Below is sample code to use the csvtojson & load data to mongodb,

```

const mongodb = require(‘mongodb’).MongoClient;
const csvtojson = require(‘csvtojson’);
let mongoUrl = “Your Mongo URL”;
csvtojson ().fromFile(‘CSV File’)
.then(csvData => {

mongodb.connect( mongoUrl,
{
useNewUrlParser: true, useUnifiedTopology: true
}, (err, client) => {
if(err) throw err;
client .db(“ipl-dashboard-data”)
.collection(“ipl-match-data”)
.insertMany(csvData, (err, res) => {
if(err) throw err;
console.log(`Inserted: ${res.insertedCount} rows`);
client.close();
});
} );
});

```

#Day2

I started to work on the #Express API in #Node application — which I used over 1.5years ago, need to do some refreshing on the same to get the speed up. #Express API done by using the library & connected to my remote #MongoDB — to fetch all the data which I have placed on #Day1. It worked fine after some retries because of my less coding in past day :)

#Day3

With the API & Data ready, I have planned to do some ground work on my UI side today — did the local setup for #React project. I am an #Angular developer — so started learning #React & doing this #100DaysofCoding challenge to boost me up.

#Day4

Continued my learning & did some basic code stuff on the #React App to get into a shape.

#Day5 

Continued on the #udemy course for #reactjs state, props, components. Continued  on the  IPL dashboard design.

*Rest to be continued….. I will try to add details everyday if not, will do it twice a week.*
Top 5 Notion Templates
Tags: productivity, watercooler, discuss, organizing
Published: 2021-04-30 14:25:29

According to Wikipedia,

> Notion is an application that provides components such as notes, databases, kanban boards, wikis, calendars and reminders. Users can connect these components to create their own systems for knowledge management, note-taking, data management, project management, among others.

My friend introduced me to [Notion](https://medium.com/u/efd97a1c507b?source=post_page-----c87635167b7c--------------------------------) a couple of years ago. Since then, my whole life is on [Notion](https://www.notion.so/). I use it to plan my semesters, my expenses, workout routines, organize tasks, organize recipes etc.

Every once in a while, I go through my notion and delete old notes or re-organize some workplaces. During one such session, I got the idea of sharing with everyone my favourite templates.

1\. Task List 🗒
================

Use it to organize tasks using [kanban boards.](https://www.atlassian.com/agile/kanban/boards) Duplicate it from [here](https://www.notion.so/Task-List-b28c850e0c6f41e9ad7dda5da51c88e5). Created by Notion.

![](https://miro.medium.com/max/1400/1*0NbPerlNRqoyBbwJiDoorA.png)

2\. Week Planner ✍️
===================

Use it to plan my week. Duplicate it from [here](https://www.notion.so/Week-Planner-9bf4906b2e294f49a6b434ce34d9de26). Created by [Christian B. B. Houmann](https://www.youtube.com/channel/UCPdcd3YwUCGvivSto6le9rg/featured). The creator also has an awesome YouTube channel where he makes videos on Notion!

![](https://miro.medium.com/max/4800/1*_VvQNEmwsQMOWiWxqwQ2xQ.png)

3\. Quick Note 📕
=================

A good template for beginners to understand the functionalities offered by Notion. Duplicate it from [here](https://www.notion.so/Quick-note-89beed65075d48e685d1a123011cc1bb). Created by Notion.

![](https://miro.medium.com/max/4800/1*IrjEvsMaRHW-Loo2wz_UzA.png)

4\. Simple Budget 💰
=================

Use it to track monthly expenses. Duplicate it from [here](https://www.notion.so/Simple-Budget-b9919a78e2514d509f9c16446dc01d17). Created by Notion.
![](https://miro.medium.com/max/1400/1*2EoNA0nEz0bErquyEtYAXw.png)

5\. Recipe Book 🥘
==================

Use it to organize recipes. Duplicate it from [here](https://www.notion.so/Recipe-book-fc44866126e642dfbf14a45980ab58b4). Created by [Philip Rau.](https://www.linkedin.com/in/philip-rau-70164431/)

![](https://miro.medium.com/max/4800/1*qrI3FSZuQxdY-lv911n7Lw.png)

All the templates officially published by Notion can be found in their [template gallery](https://www.notion.so/Notion-Template-Gallery-181e961aeb5c4ee6915307c0dfd5156d). Hope you found this post helpful. Feel free to comment or share your favourite templates on Notion.
Sending asynchronous POST requests with pure JS: ditching jQuery's ajax
Tags: jquery, ajax, javascript, vanilla
Published: 2021-04-30 14:25:28

If you ended up here, chances are you have to deal with jQuery. As you may know, nowadays, lots of things that used to be made with jQuery can be done with pure JS. An interesting fact is that [Bootstrap](https://getbootstrap.com/) has announced that they would [stop using jQuery](https://blog.getbootstrap.com/2020/06/16/bootstrap-5-alpha/) as of version 5 (the current at the moment). And that says a lot if you think about it!
Here, I would like to demonstrate a very common practice that is usually made with jQuery, but can be easily replaced with pure JS: sending asynchronous POST/GET requests.

{% gist https://gist.github.com/costa86/80419962e29e5adbdefc006494f3627b %}

That's it, people.
### Thanks for the time reading this!
Follow me:
[LinkedIn](https://www.linkedin.com/in/costa86/) | [Dev.to](https://dev.to/costa86) | [Buy me a coffee](https://www.buymeacoffee.com/costa86) | [GitHub](https://github.com/costa86)
Over 600+ of awesome CSS Animations by Animista.net for Tailwind Project
Tags: tailwindcss, css, animista, animistacss
Published: 2021-04-30 14:23:35

As the craze for use of TailwindCSS has been inclining upwards at Y Axis ever since it release, I took a faith of a big leap to this hype as well just to see how well this framework is doing in terms of making a developer life more easier (*Backend Developers especially lol jk*)

So one day I had a requirement where i wanted to use few of css animations from [Animista.net](https://Animista.net) but issue began to trouble me when i had to use `animation` & `keyframe` properties for each use of css animations (**raw css**) in my project's tailwind config file.


After a month of hard work & dedication, It turned out to be one of the best project I have ever done in my starting career of my life, So without further ado let me share the live link to my project below that will help you in adding awesome CSS animations that is originally developed by Animista.net team to your tailwind project easily without any headache :)

[Tail-Animista](https://tail-animista.vercel.app/)

I released a tailwindcss plugin for this tool few days ago just in case if you don't like to `copy & paste` the generated config file by **Tail-Animista**

[tailwindcss-animistacss](https://github.com/vikrantyadav611/tailwindcss-animistacss)

Happy Coding
An alternative or simpler way to event stream with or without Kafka
Tags: help, kubernetes, eventdriven, kafka
Published: 2021-04-30 14:08:32

Alright hear me out, I know I'm over-engineering this hobby project but I could use some advice.

In the Netherlands, emergency services receive their alerts via texts on pagers. I've bought a receiver that makes it possible to (legally!) intercept these messages and it's churning away gathering all the alerts.

I'm also into microservices and now I've got something that's steadily producing data that I can eventually show in a web interface. Now let's say that I would like to use an event bus to introduce the data captured from the alerts to the microservices which parse it and store some data (i.e. about which types of units, what kind of locations, etc.).

I've set up a cheap Kubernetes cluster in Google making use of GitLab CI/CD, Terraform, and some helm charts with KubeIP and Traefik. This is all running fine.

Now comes the challenging part. I would love to try to use Kafka to publish the events in my microservice network but geez does it become complicated there. I've found some Helm charts [here](https://github.com/confluentinc/cp-helm-charts) which seem to be meant for development, testing, or proof of concept services but it seems to contain more than just Kafka and Zookeeper. Looking at the documentation for real production data it seems like an even more daunting task.

*Now here's my question:*

What's your advice for running an event bus in a Kubernetes environment for a hobby project where I'm not necessarily afraid to learn new stuff? I'd love to hear your advice for either a bare-bone Kafka approach or any other products you could advise. Keep in mind that the budget is pretty much non-existent because It's a hobby project.

That's enough making my life unnecessarily complicated for today! :)
Flutter Appwrite Starter Template
Tags: appwrite, mobileapplications, flutter
Published: 2021-04-30 13:50:41

In this Series we will build a Starter Template for our Flutter+Appwrite Projects.

## Episode 1
In the first episode we will setup Flutter project and create basic pages and setup localizations.

{% youtube ECtoXQ50Ar0 %}

## Episode 2
In this part, we will setup Appwrite console project, setup Appwrite SDK configs, create basic login and signup functionalities.

{% youtube W_PH5tHbhhM %}

## Episode 3
In this part we will setup State management (Riverpod) and then setup handling of user authentication (login, signup) using Appwrite. Awesome, let's get started
{% youtube UZw4VVpt_ZI %}

## Episode 4
This is the final video on the series. In this series we will use user preferences to save various user settings, app version they are using, device Id etc.

{% youtube h3D40BQ4a2E %}

## Source Code
{% github lohanidamodar/appwrite_starter %}

## Want to Connect with me
- Facebook: [https://fb.me/lohanidamodar](https://fb.me/lohanidamodar)
- GitHub: [https://github.com/lohanidamodar](https://github.com/lohanidamodar)
- YouTube: [https://youtube.com/c/reactbits](https://youtube.com/c/reactbits)
- Twitter: [https://twitter.com/LohaniDamodar](https://twitter.com/LohaniDamodar)
- Linked In: [https://www.linkedin.com/in/lohanidamodar](https://www.linkedin.com/in/lohanidamodar)
What is dagger in Kotlin ?
Tags: kotlin, android, mobile
Published: 2021-04-30 13:37:10

Hello everyone , currently i am learning kotlin and there is a bunch of annotation provided by a library called _Dagger_

So what is dagger ? 
before dive into the core concepts we should know what is a dependency injection .

# **Dependency Injection**
this is compose of two words **Dependency**, in OOP is a relation between object 

![image](https://cdn-media-1.freecodecamp.org/images/1*0P-1JhnUaZeobDUAajIbhA.jpeg)

and **Injection** the action of inject one object's resource inside the other object.

> In object-oriented programming (OOP) software design, dependency injection (DI) is the process of supplying a resource that a given piece of code requires.

# **So What is DAGGER ?**
dagger is a library that facilitate dependency injection in kotlin . it is based on annotations 

> **@Module** and **@Provides**: define classes and methods which provide dependencies.

> **@Inject** : request dependencies. Can be used on a constructor, a field, or a method.

> **@Component** : enable selected modules and used for performing dependency injection

example below , and step 

1. 1) you should create a kotlin class and add the annotation _@HiltAndroidApp_ to use Dagger in your android app

```
import android.app.Application
import dagger.hilt.android.HiltAndroidApp

@HiltAndroidApp
class AllApplication: Application() {
}

```

2. 2) Secondly you have to modify you _AndroidManifest.xml_ file
to add the class we have currently created , in the Application tag like below 

```
 <application
        android:name=".AllApplication"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
...
```
After all these steps you are ready to go with the differents annotations 



# **There is only Dagger ?**
No there is another library which name is Koin
next time i will do a comparison between those two libraries.

[Documentation of Dagger](https://developer.android.com/training/dependency-injection/dagger-android)

[explanation video](https://www.youtube.com/watch?v=TQmo0oyx28k)
Stack Data Structure Using Javascript
Tags: javascript, algorithms, beginners, productivity
Published: 2021-04-30 13:28:08

#Stack:-

A Stack is a commonly used linear data structure a stack data structure follows particular operations that are performed Stack is behaved like Last in first out (LIFO) In this, we have three basic operations.
    
1. Push Method
2. Pop Method
3. Peek Method
4. Is Empty Method

####Push Method :
The push method is adding data into any type of data into the stack.

#### Peek Method: 
Peek is a very easy operation this method is given you which item or data is on the top of the list so this peek method returns the top element

#### Pop Method: 
Pop is removed the top item from the stack 

#### Is Empty Method:
The is empty method is very important this return if the stack is empty then its return true.

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

When we use push D is added then call stack on top is D then we use pop then D is removed from the stack.

##### Stack example using Javascript
```JS
//© Inspiration from coding garden


class Stack {
    constructor(){
        this.data = {};
        this.size = 0;
    }

    push(item){
        this.data[this.size] = item;
        this.size +=1
    }

    peek(){
       return this.data[this.size - 1];
    }

    pop(){
        const item = this.peek();
        this.size -= 1;
        delete this.data[this.size];
        return item;
    }
}

const launguage = new Stack();

launguage.push("Typescript")
launguage.push("Angular");
launguage.push("JS");
launguage.push("C++");

console.log(launguage)
console.log(launguage.pop())
console.log(launguage)
console.log(launguage.pop())
console.log(launguage)

```
####Output

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

I hope you like this also comments about your thoughts.

For more content follow me on Instagram  [@developer_nikhil27](https://www.instagram.com/developer_nikhil27/).

If you want to more support me then buy me a [coffee](https://www.buymeacoffee.com/nikhilbobade27).

Thank you.
Difference Between Next.js vs. Nuxt.js vs. Nest.js
Tags: nextjs, javascript, react, vue
Published: 2021-04-30 13:23:02

<b>What exactly is Nuxt JS?</b>

Nuxt JS is a high-level and open-source framework that is free and based on Vue JS, Node JS, Babel JS, and Webpack. This framework comes under universal application that makes use of meta-framework and also creates single page Vue applications.

The primary objective for creating applications with Nuxt JS is to be more flexible while developing any project. It helps the programmers create fast, complicated, and universal web apps easily and quickly.

<b>What exactly is Next JS?</b>

Next JS can be considered to be a JavaScript framework that makes use of React for creating server-side rendering as well as static web apps. According to every Next.JS developer, it happens to be the most effective tool for building websites since it has got some fantastic features and benefits that help make it the best option for developing web applications.

The initial thing that helps make it different from the remaining two frameworks is that it does not require any webpack configuration. Many developers might have proper knowledge regarding React; however, we will mention a brief intro to React, particularly for beginners.

<b>What exactly is Nest JS?</b>

It can be considered to be a framework for creating scalable and effective server-side applications. It happens to be the contemporary JavaScript that has been built using TypeScript and makes use of Express JS. The notable thing that Nest JS provides is that it helps preserve compatibility with JavaScript and the combined elements of Functional Programming, Object-Oriented Programming, and Functional Reactive Programming.

If a NestJS developer has sufficient knowledge about JavaScript, he will be able to build the most effective application in this framework. The primary objective of Nest JS is to solve the architectural issues of Node JS by offering back-end apps a modular structure to organize code into separate modules. The notable thing to work with Nest JS is that it has been fully built with TypeScript that is quite beneficial when it comes to developing an app.

Learn more in details here: https://www.rlogical.com/blog/difference-between-next-js-vs-nuxt-js-vs-nest-js/