teleren/devto huggingface dataset:
Got Bots? 3: Making Bots with QnA Maker + Azure Bot Service
Tags: beginners, codenewbie, webdev, showdev
Published: 2021-07-19 23:40:06

---
title: Got Bots? 3: Making Bots with QnA Maker + Azure Bot Service
published: true
description: In part 3 of this series, I make a Clippy bot using QnA Maker and just a Word doc for data!
tags: beginners, codenewbie, webdev, showdev
series: "Got Bots?"
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b1nsbk83w3ygvu730ax3.jpeg
---

Thanks to everyone who joined me live for my 3rd episode of [Got Bots?](https://dev.to/azure/got-bots-a-weekly-bots-series-with-the-microsoft-reactor-2b2h) with the Microsoft Reactor last week. Appreciate all of the folks who joined me live to build a Clippy QnA bot! 💛📎

If you missed the fun live, don't worry- you can watch the replay [here](https://youtu.be/foFsP9zN7ZA), and in the embedded video below! 🤖⤵️

{% youtube foFsP9zN7ZA %}

_Pssst! 🙋‍♀️ If you've missed any previous episode, check out my **Got Bots?** [series summary dev.to post](https://dev.to/azure/got-bots-a-weekly-bots-series-with-the-microsoft-reactor-2b2h) to get caught up!_

**On this episode we cover:**

-  [2:53](https://youtu.be/foFsP9zN7ZA?t=173) Previously on... _Got Bots?_ (a short recap)

-  [9:11](https://youtu.be/foFsP9zN7ZA?t=551) What is QnA Maker, and who am I/why do I build bots?

-  [17:44](https://youtu.be/foFsP9zN7ZA?t=1064) Why built in chit-chat is important/useful when building bots!

-  [24:45](https://youtu.be/foFsP9zN7ZA?t=1485) How to get started building a bot with [Azure QnA Maker](https://docs.microsoft.com/en-us/learn/modules/build-faq-chatbot-qna-maker-azure-bot-service/?WT.mc_id=academic-33453-chcondon)

- [31:06](https://youtu.be/foFsP9zN7ZA?t=1866) Populate our database with a PDF/Word Doc ([try out these examples in our docs!](https://docs.microsoft.com/en-us/azure/cognitive-services/qnamaker/concepts/data-sources-and-content/?WT.mc_id=academic-33453-chcondon))

- [34:59](https://youtu.be/foFsP9zN7ZA?t=2099) I chit-chat about how great the [Chit-Chat feature](https://docs.microsoft.com/en-us/azure/cognitive-services/qnamaker/how-to/chit-chat-knowledge-base/?WT.mc_id=academic-33453-chcondon) is. 🗣

- [46:26](https://youtu.be/foFsP9zN7ZA?t=2786) I upload our PDF and ✨magically✨ create our knowledge base!

- [48:50](https://youtu.be/foFsP9zN7ZA?t=2930) Testing our QnA bot and training the knowledge base.

{% twitter 1415370520888061955 %}

_Did you have fun? check out [Got Bots? 4](https://dev.to/azure/got-bots-4-making-bots-with-the-azure-portal-23jn) where I continue to work on our [QnA Maker](https://docs.microsoft.com/en-us/learn/modules/build-faq-chatbot-qna-maker-azure-bot-service/?WT.mc_id=academic-33453-chcondon) Clippy bot, and continue to test and add more to our knowledge base!_
CI/CD Explained in 6 minutes
Tags: devops, cicd, build, deploy
Published: 2021-07-19 23:22:08

__What is CI/CD__? What are the concepts behind Continuous Integration, Continuous Deployment, and Continuous Delivery?

These are the question __we are going to answer Today__! I'm going to explain the __CI/CD core concepts__, so you'll understand what Continuous Integration and Continuous Deployment are, in just __6 minutes__.

This is an introduction to CI/CD that will give you a clear idea of what they are.

I will also cover how the teams do CI CD in GitHub.

### Video

Here you have __the video with the whole explanation__.

Enjoy the watch :)

{% youtube OSzrpgogQOM %}

[Link to the video: https://youtu.be/OSzrpgogQOM](https://youtu.be/OSzrpgogQOM)

__Like, share and follow me__ 🚀 for more content:

📽 [YouTube](https://www.youtube.com/CoderDave)
☕ [Buy me a coffee](https://buymeacoffee.com/CoderDave)
💖 [Patreon](https://patreon.com/CoderDave)
🌐 [CoderDave.io Website](https://coderdave.io)
👕 [Merch](https://geni.us/cdmerch)
👦🏻 [Facebook page](https://www.facebook.com/CoderDaveYT)
🐱‍💻 [GitHub](https://github.com/n3wt0n)
👲🏻 [Twitter](https://www.twitter.com/davide.benvegnu)
👴🏻 [LinkedIn](https://www.linkedin.com/in/davidebenvegnu/)
🔉 [Podcast](https://geni.us/cdpodcast)

<a href="https://www.buymeacoffee.com/CoderDave" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px !important; width: 108px !important;" ></a>

{% youtube OSzrpgogQOM %}
Get a Developer Oriented Domain for Free and Use it with Vercel
Tags: domain, vercel
Published: 2021-07-19 23:16:55

https://thedev.id/
>A free identity for developers on the web

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5fwyqlb6y7w97v5mhijb.jpg)


thedev.id offers a subdomain, `yourname.thedev.id` for free which is awesome.
A great thing is that thedev.id allows devs to use Vercel.

Actually, I'm using it for my nextjs site that is hosting on Vercel.

Steps you will need are the below.

Step 1. Fork the repo
Step 2. Add your domain to `subdomains.json`
Step 3. Open a new PR
Step 4. Add `yourname.thedev.id` to a service(GitHub or Vercel)


### Step 1 Fork the repo

Go to the following repo and `Click the Fork button` to fork the repo.
 
{% github fransallen/thedev.id %}


### Step 2 Add your domain to `subdomains.json`

Open `subdomains.json` and add the following style to the file.

```json
"subdomain(whatever you want to have)": "site url that you are using for the site to host your site"
```

In my case, the added line is like below.
```json
"koji": "portfolio-nextjs-gdm7chx6i-kojikanao.vercel.app",
```

#### All names are ordered alphabetically, so you have to follow that rule.

### Step 3 Open a new PR
After editing `subdomains.json`, you need to push `subdomains.json` to your forked repo and open a new `pull request`

There is no specific format for a PR.
The following is my PR.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/023hpwfqklkoim6rkwbh.jpg)

You can follow other people's styles.
https://github.com/fransallen/thedev.id/pulls?q=is%3Apr+is%3Aopen+sort%3Aupdated-desc

The review process was very quick. In my case, it didn't take a day.


### Add `yourname.thedev.id` to a service

Go to your project dashboard on Vercel and click `Settings` tab and select `Domains` then add `subdomain.thedev.id`.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/61ahge7x64ji8gft21od.jpg)


The subdomain will work pretty soon!
Of course, it supports `https`, so you can access your website with `https://subdomain.thedev.id`.

In terms of `GitHub`, the process would be similar to Vercel. What you will need to do is to add the domain to your GitHub repo.

Hope you enjoy this!!!
Tips to organize well your Css
Tags: html, css, webdev, beginners
Published: 2021-07-19 23:01:00

## HOW TO ORGANIZE YOUR CSS

Organizing your Cascading Style Sheet(s) it is a pretty cool way to start developing on writing clean code if you are  beginner and if you are pro means you must deal with huge of Css file then it’s important to organize well your Css  to reduce errors and to make  code human readable.


WHY!  ORGANIZING WELL YOUR CSS
To increase your productivity
Make easier to maintain when it comes in solving some errors
To produce clean code.



Some steps to ensure that your css is well organized

- Use external CSS.
This is the most helpful way to to organize your css rather than use internal css or inline css so use external way to organize your css



- Define variables.
Custom properties (sometimes referred to as CSS variables or cascading variables) are entities defined by CSS authors that contain specific values to be reused throughout a document. Complex websites have very large amounts of CSS, often with a lot of repeated values.Declare a variable in global zone,global variables are generic variables that will be used to keep the consistency between all our 
Components.



- Comment your css.
Adding comments to your CSS will help any future developer work with your CSS file, but will also help you when you come back to the project after a break.




- Prefer to use class instead of id’s
When your are creating a selector that can be reusable most of times it is better to use a class selector and in styling it is highly recommended to use class.

###Thanks if you reach out to the end
*It is my first post please*
*show love*
follow me in IG [@paschal_maxillian](https://www.instagram.com/paschal_maximillian/)
Introducing the NFT module of CENNZnet
Tags: blockchain, opensource, startup, jamstack
Published: 2021-07-19 23:00:26

Introducing the latest module of CENNZnet, an open-source blockchain network for DApps(Decentralised Apps).


We've recently launched the CENNZnet NFT module, which gives you the power of minting and selling NFT(Non-Fungible Token) through a simple JavaScript API.

NFT allows you to capture and trade digital assets on a blockchain network. 

For more inspirations on how NFT can be used to solve real-world problems outside selling digital arts:

• [NFTs are ready to disrupt the ticketing world!](https://medium.com/centrality/nfts-are-ready-to-disrupt-the-ticketing-world-5cf13c637912)
• [Developing real-world use cases for NFTs: Techweek 2021 hackathon](https://medium.com/centrality/developing-real-world-use-cases-for-nfts-tech-week-2021-hackathon-a66da020d92a)
• [Fighting climate crisis with NFTs: CENNZnet & CarbonClick hackathon](https://medium.com/centrality/fighting-climate-crisis-with-nfts-cennznet-carbonclick-hackathon-ef13b85b99a?source=collection_home---4------3-----------------------)

Get started with the NFT module [here](https://cennz.net/knowledge-hub/core-modules/introducing-the-cennznet-nft-module/)!
What's blockchain best suited for?
Tags: blockchain, ideas, startup, decentralisation
Published: 2021-07-19 22:46:29

When you add blockchain technology into an app, it becomes a new breed of app called DApps(Decentralised Apps).

• Why are people decentralising their apps these days? 
• What are the technical advantages blockchain gives you?
• What kind of problems are blockchain best suited for?

Find out from our in-depth article on [The best use cases for DApps](https://cennz.net/knowledge-hub/cennznet-blockchain-101/the-best-use-cases-for-dapps/) :)
I just discovered Sonic Pi
Tags: music, sonicpi
Published: 2021-07-19 22:37:56

Sonic Pi is "The Live Coding Music Synth for Everyone". It lets your make music through code. I'm so excited about this that I'll be working all the way through the tutorial which ships with the software. And to keep myself engaged, I'm going to publish the process on Youtube. You can find the playlist, which I should be updating fairly regularly, [right here](https://www.youtube.com/playlist?list=PLK3zM7Pklmc2K6i4Oke68C1RWMrU7Zj3q)!
Next.js with Web3Modal Example
Tags: nextjs, ethereum, web3, dapps
Published: 2021-07-19 22:19:58

---
title: Next.js with Web3Modal Example
published: true
description: An example website built with Next.js and Web3Modal. Connect to an Ethereum wallet using Next.js!
tags: nextjs, ethereum, web3, dapps
canonical_url: https://codebushi.com/nextjs-with-web3modal-example
---

Hey everyone! I recently built an example website using Next.js and [Web3Modal](https://github.com/Web3Modal/web3modal). For those of you who don't know, Web3Modal is a simple way to connect your website to a Web3 / Ethereum wallet.

This is essential when building a decentralized application (dApp) because you need a wallet to interact with the Ethereum application.

Here is the example site: http://web3modal-example.vercel.app

Here is the source code: https://github.com/ChangoMan/web3modal-example

In order for the Web3Modal to work in your browser, you'll need the [MetaMask](https://metamask.io/) Chrome extension, or a [WalletConnect](https://registry.walletconnect.org/wallets) compatible wallet.

I was going to create a full blog post explaining how everything worked, but wasn't sure if anyone would be interested.

If you would like a more in depth explanation of the source code, let me know in the comments down below! Thanks for looking!
The Pros and Cons of React Native and Should You Learn It?
Tags: reactnative, native, javascript, mobile
Published: 2021-07-19 22:17:43

For the past few weeks I have been working on a mobile project that I am building with React Native. When I decided to start working on my app I didn't give much thought about the framework to use. React Native seemed like the obvious choice because I had just learned and created a few projects with React. Although I have not run into any problems, I can't help but wonder if it would have been worth it to learn Kotlin or Swift instead.

After doing some research here is what I have learned about the strengths and weaknesses of React Native.

React Native's biggest strength is it's convenience. There are a few reasons why it is much more convenient to use React Native than to create a native app.

Primarily, React Native saves time on coding because it allows you to maintain one codebase for Android and iOS. This is a huge benefit for people looking to publish an app for both the iOS and Android stores.

Moreover, because of it's similarity to React, it's very easy for programmers with experience in React to pick up and learn React Native. On top of that, if your building a mobile app with a web app counterpart, you can share a lot of the code. This is another way to cut down on development time with React Native.

However, many companies choose to build native apps over using React Native because they can get better performance from a native app than an app built using React Native. Yet, this performance gain is not so significant that it always outweighs the convenience gained from using React Native. This is evident by the fact that many popular apps like Instagram, Skype and Facebook use React Native.

Airbnb even testified in their blog post about why they stopped using React Native (https://medium.com/airbnb-engineering/react-native-at-airbnb-the-technology-dafd0b43838), that *"One of the largest concerns around React Native was its performance. However, in practice, this was rarely a problem. Most of our React Native screens feel as fluid as our native ones."*

Overall, I believe React Native is a framework that is definitely worth picking up and using. Although there are some benefits for building native apps with Kotlin or Swift, the development time saved by using React Native is just too good to ignore. From my experience, I've been really impressed by the ease of which I have been able to create my project with the knowledge I carried with me from using React.
Day 411 : Lift You Up
Tags: hiphop, code, coding, lifelongdev
Published: 2021-07-19 22:15:02

_liner notes_:
- Saturday : Found out that Biz Markie, a pioneer in HIPHOP passed away on Friday. Kind of messed up my whole mood. We did a mini tribute on the radio show. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of a photo of Biz Markie posing on a street corner holding is jacket open and a large necklace around his neck with the words July 17th 2021 Nobody Beats The Biz EVER](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0us495h3zboiotsev91f.jpg)

- Sunday : Did the https://untilit.works cyphers. Got a bunch of stuff done so that was good. Everything worked perfectly except for the very last session, the archived video didn't get uploaded to Vimeo and the thumbnail wasn't created. No clue what happened. All the backend says it timed out. This is a good opportunity to build the ability to manually upload the archived video, create a highlight clip and thumbnail from the dashboard. I'll probably work on that this week. Other than that, just watched some anime and "Kevin Can F Himself".

- Professional : Had a bunch of meetings today. When all that was over, I worked on a little refactor of the demo project that I have been pair programming with a Product Manager since Facebook won't let me create an account. The refactor is going really well. Everything is working so far on my end. There's one part that relies on an interaction from Facebook, but since I can't create an account, I'll have to wait and test it with the Product Manager tomorrow.

- Personal : This weekend was okay. I think hearing the passing of Biz Markie kind of threw me off. It seems like so many people I was a fan of growing up are passing away this year. I don't know. Especially when music is a thing that can lift you up. Other than that, I think I may have found the solution to an issue I was thinking about on how I would raise the living container I'll be building so I can slide it in and out of the van. I happened to come across these devices that are used to raise motorcycles so people can work on them. I ordered one to see how the quality is and if it looks good and works, I'll be ordering some more.

![Look up at a waterfall covered in green lush vegetation in Sekumpul Waterfalls, Indonesia](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hkqrljzlgbqyi35zg9ma.jpg)

The motorcycle lift is supposed to be coming in today. Looking forward to checking that out. I'm going to eat dinner and watch the new "Rick and Morty" that I didn't get to watch last night because I fell asleep maybe get an episode of "Fire Force" in also. I'll probably put the finishing touches on that demo I was working on earlier, just so it's all ready when I pair program tomorrow to work out any bugs with the Facebook integration. If I have time, I'll probably start working on adding more functionality to the https://untilit.works dashboard. We'll see.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube lgKECL4w8FM %}
4 métodos importantes del módulo path en Node.js
Tags: javascript, node, backend, spanish
Published: 2021-07-19 20:58:26

#**Índice**   
1. [Introducción](#id1)
2. [¿Cómo requerimos los módulos del core de Node?](#id2)
2. [El método `sep`](#id3)
3. [El método `join`](#id4)
4. [El método `basename`](#id5)
5. [El método `resolve`](#id6)
7. [Referencias](#id7)
8. [Conclusiones](#id8)

## **Introducción** <a name="id1"><a/>
Al instalar cualquier versión de Node.js podemos contar con módulos que vienen por defecto en su core y por ende pueden ser utilizados de inmediato. Ahora bien hay un montón de estos módulos y estudiarlos todos desde el vamos es algo estupido (a mi criterio) por ello, recomiendo aprender el funcionamiento general de los más importantes y a medida que prosigas con tu aprendizaje de Node podrás profundizar más sobre estos módulos.

Un módulo básico y bastante sencillo de usar es el módulo `path` y a continuación les mostraré 4 métodos que opino usar casi siempre que requieras este módulo.

## **¿Cómo requerimos los módulos del core de Node?**  <a name="id2"><a/>
Es muy sencillo, basta con escribir:

```js
const path = require('path')
```

> Como mencione al instalar Node estos módulos vienen por defecto también instalados, entonces el `require('path')` no necesita que se le indique la ruta de donde se encuentra `path`, basta con indicarle que lo usaremos y ya, bastante fácil.

## **El método `sep`** <a name="id3"><a/>
`sep` es una abreviatura de **separador**, este método nos devuelve el carácter de separación que usa cada sistema operativo para sus rutas, por ejemplo:

{% replit @CristianFernan6/TeemingWeeklyPlane %}

Como puede observar la salida en mi caso es : `/`, esto por que el script se ejecuta sobre el Windows 10 de mi PC, si tienes una Mac o usas Linux el resultado será diferente.

## **El método `join`** <a name="id4"><a/>
`join` nos permite unir o juntar pedazos de rutas por separado para tener como salida una ruta resultante final, por ejemplo:

{% replit @CristianFernan6/join%}

El el ejemplo tengo una carpeta `helpers` que contiene una carpeta `js` y a su vez tiene un archivo `test.js`, para llegar a dicho archivo uso `path.join()` y formó la ruta válida para accederlo.

## **El método `basename`** <a name="id5"><a/>
`basename` me permite obtener el nombre del archivo final de una ruta, por ejemplo:

{% replit @CristianFernan6/basename %}

## **El método `resolve`** <a name="id6"><a/>
Hasta ahora solo vimos métodos que trabajan con rutas relativas, `resolve` permite obtener rutas absolutas de una manera sencilla, por ejemplo:

{% replit @CristianFernan6/resolve %}

---

## **Referencias** <a name="id7"><a/>

{% youtube Oe421EPjeBE %}

---

## **Conclusiones** <a name="id8"><a/>
* El módulo `path` es básico al momento de aprender Node.
* `path` nos permite poder manejar las rutas tanto relativas como absolutas de nuestra PC y de nuestro proyecto.
* `path` al igual que otros módulos cuenta con muchísimos métodos, no los quieras aprender todos de golpe, aprender los más usados y a medida que avances con Node podrás conocer más métodos.

---


![img](https://media.giphy.com/media/eY1JD4KPG4HMk/giphy.gif)
testing sansung dev
Published: 2021-07-19 21:31:32

as a younger dev i thought to carry my setup every well now i can
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qiqkzve6jpo130bpadz1.jpg)
this is sansung s10e on wide screen 4k monitor using a dell mouse and kinise advantage keyboard its hydird dekstop mobile setp
How to learn how to learn (as a dev)
Published: 2021-07-19 21:29:53

![Inspiration credit: _woodnest_ on instagram](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n8vnn775eutwmg90w14d.jpg)
This is a TLDR on an article I just went through by Josh Comeau about how to learn effectively as a dev.

One major takeaway was to **"learn in public"**. That is, share what you learned for the sake of ensuring you actually learned it.

Learning in public seems (to me) connected to Einstein's quote: "If you can't explain it to a 6 year old, you don't understand it yourself". It also appears related to the concept of "the protégé effect".

I was about to write this blog post *after* I set up a fancy blog on my website: [seif.rocks](https://seif.rocks). But Josh warned about this mental trap that keeps one from ***starting***.

So, I decided to write my *first* blog post (I think) about some of the main takeaways from Josh's article. Here we go:

## "Guided" vs "Unguided" learning
Guided learning is when you read tutorials, docs or watch videos (amongst others). Unguided learning is when you code it out yourself.

In order to learn more effectively and avoid things like **tutorial hell**, you can mix the two methods. For example:
1. Try figure out the purpose each block of code (from the tutorial) and prove yourself right (or wrong) by **fiddling** with it.
2. Follow the tutorial as instructed. But *then*, **minimize the tutorial window** and try to redo it yourself. This way you can test yourself because "tests are best" after all.
3. Follow the tutorial as instructed (again), But *then*, **do a different or extended version**. For example, If you learned how to do an Instagram clone, do a twitter clone. Or, if you did a tutorial
with plain and boring frontend, make it more production-like.

## Build daily habit
Instead setting a side one day per week for learning. Make it a daily thing. 

For me, I (try to) start my day with one hour of solving algo problems.

The main benefit of habits is that the more you do them the less they feel like a "chore", and consequently the less "motivation" you need to keep them going.

Read the blog post here: [joshwcomeau.com/blog/how-to-learn-stuff-quickly/](https://www.joshwcomeau.com/blog/how-to-learn-stuff-quickly/)

Image credit belongs to [_woodnest_](https://www.instagram.com/p/CP7r0SVJ0Jy/)