teleren/devto huggingface dataset:
Who is a full stack developer?
Tags: web, frontend, backend, developer
Published: 2021-02-07 19:44:50

As someone who is new to the web development world you may have heard of the word "full stack developer" or better still, maybe you haven't or perhaps, you're just a "tech enthusiast". ;)

The programming world as a whole is filled with many jargons and as a newbie you might be feeling overwhelmed with all these ocean of terms and you therefore need someone to explain many of them to you. Don't worry as you will gradually get used to them with time, even the most experienced of programmers sometimes need a reminder of their meanings.

"Full stack developer" is used to describe someone who is expert at back-end and front-end languages and frameworks. This means that this developer who calls himself a full stack developer is able to program the back-end of a website as well as design the front-end (User Interface).

Usually you will have the back-end developer build the API and handle all the server side logics involved in the web application while the front-end developer is responsible for developing the User Interface and taking care of User Experience and SEO (Search Engine Optimization), to mention but a few. But in the case of a full stack developer, he is responsible for doing both the Job of the front-end developer and that of the back-end developer.

To become a full stack developer, you will have to learn how to use front-end languages, frameworks and tools such as JavaScript, HTML, CSS, SASS, Webpack for compiling your JavaScript to support older browsers, etc and then the server side languages and frameworks such as Laravel for PHP developers, Django for the python developers, MySQL, sqlite, postgreSQL for communicating with the databases and other DevOps involved in the development of a full fledged web application. The list is so lengthy that I have to just name a few of them to keep it lean.

I hope I was able to explain it to your level of understanding, though I know there's more to it that I didn't mention but the idea for this article was to get you acquainted with the concept and what it represents and I'm pretty sure I have done that. If you have any questions or you want to contribute to the discussion, let me know what you think in the comment section below.
This is a test post
Published: 2021-02-07 19:33:22

Let's see if dev.to is suitable for some kind of technical dev/devops blogging.

First, I must say I really dig the fact that they support Markdown as input for your blog posts. (This is a **MUST** for my use case)
```
Here is a piece of code
```
Yeah!
The "preview" function looks cool as well.

# A big header

## A smaller header

### An even smaller header

> This site is cool - someone

Great quote, buddy!

And here is a picture:

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

Ooooow! The integrated function to upload your image straight to S3 is sweet!!!

OK! I love it for now!

How about checkboxes?

- [ ] Nope
- [X] Yeaahhh

And emoticons?
:smile:
:tada:
Asynchronous JS: Finally discover how to use SetTimeout and SetInterval
Tags: javascript, tutorial, webdev, codequality
Published: 2021-02-07 19:22:26

`Hello World!` The fifth episode of the series  - A CSS/JS trick in 5 minutes - [Last Article](https://dev.to/devlorenzo/js-on-scroll-events-4232) was about a JS trick (On scroll event)
I want to show you another Javascript trick: How to work with SetTimeout and SetInterval.

--- 

SetTimeout will wait foo seconds and then execute the action. SetInterval will execute this same action every foo seconds.
Both can be inline or multiline, I recommend using multiline 99% of the time. It's important to notice that they work in milliseconds. 

SetTimeout:
```
setTimeout(function(){
 	alert("Hello World!"); 
}, 2000); // 2 seconds 

setTimeout(function(){ alert("The fifth episode of the series"); }, 3000);
```

SetInterval:
```
setInterval(function() {
  alert("I want to show you another Javascript trick:");
}, 1000); 

setInterval(function() {alert("How to work with SetTimeout and SetInterval");}, 1000); 
```
* If you want to remove the first delay you have to add code a first time out of the function. I recommend you save this code in a separate function you can call whenever you need. 

---

I also recommend you to don't use SetInterval but an advanced SetTimeout. This [stack overflow](https://stackoverflow.com/questions/6685396/execute-the-setinterval-function-without-delay-the-first-time) explains why.
```
function foo() {
   alert("Remember the like ♡") 
   setTimeout(foo, 1000);
}

// start the cycle
foo();
```
 
--- 

If you want to understand more about how SetTimeout and SetTimeout works.

> Javascript is singled-threaded but the browser is not. The browser has at least three threads: Javascript engine thread, UI thread, and timing thread, where the timing of setTimeout and setInterval are done by the timing thread.
> When calling setTimeout or setInterval, a timer thread in the browser starts counting down and when time up puts the callback function in javascript thread's execution stack. The callback function is not executed before other functions above it in the stack finishes. So if there are other time-consuming functions being executed when time up, the callback of setTimeout will not finish in time. [Stack Overflow](https://stackoverflow.com/questions/22051209/how-does-setinterval-and-settimeout-work#:~:text=When%20calling%20setTimeout%20or%20setInterval,it%20in%20the%20stack%20finishes.)

---

Hope this helped and thanks for reading!

> Please smash that like button to make me understand that you want the series to continue 

---

## **[Subscribe to our newsletter!](https://worldindev.ck.page/)**
A loooong, and fun, weekly recap for you 
Free PDF version of my articles
Highly customizable inbox
That's --> free <-- and you help me!
It's never too late to begin again.

Published: 2021-02-07 19:00:25



I am from Bangalore, India and anyone who has been there will tell you 2 things:        
1. The traffic jams are unbelievable.  
2. Every second person you talk to is a techie. 

In this part of the country, most parents encourage their kids to pursue engineering, as their profession. Maybe that's why, i wanted to be a rebel. I didn't want to do something that  everybody was doing, didn't want to be ordinary. I didn't know what i wanted to pursue as a career, but knew it wasn't going to be the obvious. Was that a good enough reason? Guess i'll never know. 

I worked towards getting into the best Architecture schools in my city and even began a career in the field. But it just wasn't my cup of tea. Today I ended up here, trying to make my mark as a web developer 10 years after i decided to stay away from this very field. I can't help but wonder how easy things might have been if i just picked this in the first place. But that ship has sailed. Maybe I can never take away what these past years have taught me. Maybe i would not have appreciated things, if they came too easy. After all, nothing can substitute experience.

When i'd been working as an Architect, it just never felt right. I managed to do my job well but it didn't feel like i belonged there. I was surrounded by friends and family who were techies. Hearing them talk about work, programming languages, terms that i'd never heard of, felt like they were in a deep, vast ocean i knew nothing about. I often wondered if i could ever enter that ocean but quickly realised i'd be totally lost in it. And who knew if I would be good at it. Besides, i'd put way too much time and effort into my profession to think about making a switch. Even if i made a mistake picking my profession, it was my mistake and i had to live with it.

2020 has been a crazy year for everyone. It made us appreciate the simple things in life. It made us look at each day as a gift that we ought to  make the most of. Things could change in a matter of seconds. It also pushed me to take risks. It made me realise that it was okay to change my mind. It was okay to start fresh. 

* Be brave enough to be bad at something new. 

* It's never too late to be who you might've been.

* Don't force yourself to fit in, where you don't belong.  

* If you cant stop thinking about it, take the risk. 

* Work for the life you want.

So here I am, trying to be a web developer in 2020. Trying to learn languages, software and tools i'd never heard of. Aiming to build stunning websites and create cool apps. Trying to land that dream job. And maybe one day, help others have a similar journey like my own.
Tell us what you don't know!
Tags: discuss, career, exercise
Published: 2021-02-07 18:59:25

Too often do we take part in discussions about topics we actually don't no much about. Especially on the internet. And especially during the pandemic. I would have loved to have heard the following sentence more often: "I do not know".

**We're all experts at something, but none of us are experts at everything. So please join me in this little practice of telling us – but even more importantly yourself – what you no nothing about.**

This can be something you still want to learn but also something you will probably never learn. This can be about programming, obviously, but doesn't have to be.

# Bonus challenge

As a bonus, think about people who do have the skills you find yourself missing. Or think about people, maybe your colleagues, that you believe are more successful than you are. Focus on your feelings towards them. Do you admire them? Or do you maybe also experience some envy? Just ponder on these emotions for a while and see how they mix. Simply being aware of these feelings will help you become more professional. Just acknowledge that you don't know everything. There will always be someone who can do something better than you can. And that's okay. It's perfectly fine. 

Allow yourself to be passionate about your work but aim for a professional detachment. **You are not your work.**
What is Web Development
Tags: webdev, programming, codenewbie
Published: 2021-02-07 18:56:15

So when I started coding almost 5 years ago, I searched the web for "what is web development" and I found some articles which explained what web developers do, what are the types wed development fields and numerous more but I couldn't particularly find what I searched which was "what is web development", but after a few years I understood the meaning of it, So make your journey easier I will explain it in this article and I will also cover some more short topics so you can also skip that if you want to.

## What is web development
Web development is the building blocks and maintenance of websites on the internet, it’s the work that happens behind the scenes to make a website work fast and perform well with the best user experience it can possibly give.
You can also say that web development is like a field for making a website. The relation of web development to a website is like what chemistry is to a chemical (not sure if I should use this example).

## Types of web developers
So there are 3 types of web developers:
_1. Front-end web developers:_ A front-end developer takes care of the design, the looks, and the interactivity using HTML, CSS, and JavaScript, and some kind of frameworks if needed. What you see and what you use, such as the visual aspect of the website, the drop-down menus, and the text, are all brought together by the front-end developers, who writes a series of programs to bind and structure the elements, make them look good and add interactivity. These programs are run on browsers.

_2. Back-end developers:_ The back end refers to the guts of the application, which live on the server. The back end stores and serves program data to ensure that the front-end has what it needs. This process can become very complicated when a website has millions of users. Back-end developers use programming languages like Java, Python, and Ruby to work and manage data.

_3. Full-stack developers:_ If both Frontend and Backend development fascinates you, you could consider becoming a Full-stack developer. Full-stack developers take care of both the front-end and the back-end and need to know how the web works on all levels, in order to determine how the client- and server-sides will relate. Naturally working up to this level of expertise will takes longer, as there is more to learn.

## What do web developers do?
Web developers often work for clients to create websites for them and earn money. The work is typically very project-focused and involves collaborating with a team that helps to coordinate the client’s needs into the end product. The client could be a tech company, an organization, or a government. The work could involve front-end, back-end, or full-stack web development.

Please leave feedback or any questions you have in the discussion section below.

Don't forget to follow me on [Twitter](https://twitter.com/GarvitMotwani)
What's new in Google Chrome?
Tags: googlechrome, google, software, chromebrowser
Published: 2021-02-07 18:38:46

A feature in Google Chrome helps you keep your personal information safe by hiding notifications in screen sharing mode.

Video conferencing has become commonplace in times of pandemic. Either for work, study or simply because we want to show something to someone while we share our screen. 
Sometimes notifications that have nothing to do with the issue end up leaking. This could be avoided by disabling this feature, but it is not always so straightforward. The <a href="https://www.google.com/chrome/dev/">developers of Google Chrome</a> have thought of a solution so that we do not reveal sensitive data.

A new feature in Chrome will allow you to hide the content of notifications when you are sharing the screen. Once you stop sharing it, all notifications will automatically show up. This can be very useful to maintain privacy without losing pop-ups. 
As reported on the Google blog, this feature includes notifications from Google Chat, email notifications, and other third-party <a href="https://listbaypress.wordpress.com/">websites</a>.
 
So ... how are notifications muted? You can prevent the content of alerts from being displayed by selecting the " mute " option. You can also configure the browser to not show any notifications until you finish sharing the screen.

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

Google also indicated that this function responds to the new ways of working in which many users use different applications to communicate: "We hope that this function reduces distractions and prevents confidential or personal information from being accidentally displayed while sharing the screen."

This Chrome feature will be rolled out gradually within the next few days and will be available for the following products: Google Workspace Essentials, Business Starter, Business Standard, Business Plus, Enterprise Essentials, Enterprise Standard, and Enterprise Plus, as well as G Suite customers Basic, Business, Education, <a href="https://listbay.blogspot.com/">Enterprise for Education</a>, and non-profit organizations. It can also be used by users with personal Google accounts.

Google wants to protect your passwords in Chrome

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

Google Chrome will enable a feature to help you strengthen the security of your passwords stored in the browser.
If it detects that a password is weak or has been compromised, it will notify you so that you can take the most appropriate measure.
For example, its modification. This feature will be available for the desktop and iOS versions in the coming days.

NB: If you want to know more about Google Chrome or any other browser you can <a href="https://listbay.org/popular-internet-browser-icons/">go to this link</a>.
The behavior of docker run --network=host
Tags: discuss, help
Published: 2021-02-07 18:20:23

I'm on WSL2 Ubuntu 20.04, Docker v20.10.2, and according to the [docs](https://docs.docker.com/network/host/)

> docker run --network=host ... is supported only on Linux

So now I'm trying to understand its behavior on WSL2.

It's **possible to make requests** with `--network=host`, but **not possible to listen** to requests (what?)
```bash
# Listening doesn't work (as expected)
docker run --network host --rm --name webserver -d nginx
curl localhost:80
# connection refused

# Making requests works, but why?
docker run --rm  --name webserver -d -p 80:80 nginx
docker run --rm --network host httpd:2.4.46 ab -n 100000 -c 10 http://localhost:80/
# works

# Another way to make requests which work, but slower
docker run --rm --network host httpd:2.4.46 ab -n 100000 -c 10 http://host.docker.internal:80/
# also works, though super slow, see - https://docs.docker.com/docker-for-windows/networking/#use-cases-and-workarounds
```

### Conclusion (?)

The `--network=host` behavior on Windows WSL2 is as follows
- ❌  Doesn't work for **listening** 
- ✔️  Works for making **requests** from a container to the host's network. This means another container has already exposed one of its ports with `-p` or `-P` 

Can anyone confirm the above conclusion? Does it make sense?
Resolve 404 error on Vue Routes on the Apache
Tags: vue, apache, htaccces
Published: 2021-02-07 18:31:46

After build of a VueJS application and config to run in  Apache, is common return an 404 error when attempt access the routes.
![Error 404 on Apache 2 Vue route](https://wallacemaxters.com.br//uploads/error_404.png)

This happens when the Vue Route uses the [History Mode](https://router.vuejs.org/guide/essentials/history-mode.html) and the rewrite is not correctly configured.


## Enable Apache 2 url rewrite and fix the 404 error in Vue

You need to configure your `.htaccess` file to rewrite all path urls to `index.html`.

Write a `.htaccess` at the Vue application root and paste the follow content:

```apache
<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>
```
Fluid Framework discovery
Tags: dotnet
Published: 2021-02-07 18:13:30

<sub><span>Photo by <a href="https://unsplash.com/@andremouton">Andre Mouton</a> on <a href="https://unsplash.com/s/photos/mirror">Unsplash</a></span></sub>

I just discover that Microsoft has open sourced an interesting framework for distributed data in javascript application / websites: [Fluid Framework](https://fluidframework.com/) . It's even compatible with most popular UI javascript framework.

This [blog about it](https://blog.logrocket.com/microsofts-fluid-framework-an-introduction/) helps in explaining core concepts.

The [official documentation](https://fluidframework.com/) and the [github repository](https://github.com/microsoft/FluidFramework) seem clear.

The [playground](https://fluidframework.com/playground/) has multiple React samples but, this [sample is using Angular](https://github.com/DanWahlin/FluidAngular).


Hope this helps !
Lean into the fear
Tags: career
Published: 2021-02-07 18:09:51

[Chantastic](https://twitter.com/chantastic?lang=en) recently spoke at [ReactJS Dallas](https://www.meetup.com/ReactJSDallas/) about dealing with Imposter Syndrome. One of my favorite moments was when he talked about being asked to take over [React Podcast](https://reactpodcast.com) hosting duties. He said he was afraid he was going to say the wrong thing to the amazing developers he would be interviewing.

Eventually he realized that fear was the only reason not to take the offer. So instead of passing up a fantastic opportunity, he decided to lean into the fear.

Listening to someone I've heard interview JavaScript heavyweights on my iPhone for the past few years talk about facing his own fears renewed my long-held belief that I need to lean into the things that make me afraid.

The first time I was asked to give a software talk, I had been a professional developer for less than a year. I was terrified, but I did it. Was it good? Meh. But the important part was I stepped out of my comfort zone. I still experience a fear of public speaking, but the more I push through that fear, the quieter its gets.

If fear is the only thing keeping you from doing something that could otherwise enrich your life, lean into it. Intentionally do something *because* it scares you. Start a YouTube channel. Give a talk at a Meetup. Try [blogging for 28 days straight](https://www.falldowngoboone.com/blog/blogruary-28-days-of-posting/).

Push past the fear, get comfortable with being uncomfortable. You never know what it might lead to.

Have you ever let fear hold you back from doing something? Make an action plan today to lean into that fear, and let others know so they can encourage you. Don't know where to start? [I'm glad to answer any questions](https://twitter.com/therealboone).
Doodle 0.4.1 released
Tags: kotlin, webdev, javascript, opensource
Published: 2021-02-07 17:33:43

[Doodle](https://github.com/nacular/doodle) is a pure Kotlin UI framework for the Web, that lets you create rich applications without relying on Javascript, HTML or CSS. Check out the [documentation](https://nacular.github.io/doodle) and [tutorials](https://nacular.github.io/doodle-tutorials) to learn more.

## Highlights include:
- Spinner "constructor" functions now take optional ItemVisualizer
- New API for scrolling [List](https://github.com/nacular/doodle/blob/master/Controls/src/commonMain/kotlin/io/nacular/doodle/controls/list/List.kt#L270)/[Tree](https://github.com/nacular/doodle/blob/master/Controls/src/commonMain/kotlin/io/nacular/doodle/controls/tree/Tree.kt#L731) to an index/path
- Native ScrollPanel behavior now supports smooth scrolling
- Native TextField behavior now allows spell-check to be enabled
- New [FilteredList ](https://github.com/nacular/doodle/blob/master/Core/src/commonMain/kotlin/io/nacular/doodle/utils/FilteredList.kt#L10)to support a filtered view of an ObservableList
- New [helper](https://github.com/nacular/doodle/blob/master/Controls/src/commonMain/kotlin/io/nacular/doodle/controls/theme/CommonTextButtonBehavior.kt#L127) for creating simple text button renderers
- Added [NativeHyperLinkBehaviorBuilder](https://github.com/nacular/doodle/blob/master/Browser/src/jsMain/kotlin/io/nacular/doodle/theme/native/NativeHyperLinkBehavior.kt#L16) to allow full customization of hyperlinks
- New [helpers](https://github.com/nacular/doodle/blob/master/Core/src/commonMain/kotlin/io/nacular/doodle/text/StyledText.kt#L31) for Underline and LineThrough TextDecorations

See the full [release notes](https://github.com/nacular/doodle/releases/tag/v0.4.1) for more details.

{% github nacular/doodle no-readme %}
Merging a pdf using Javascript
Tags: javascript, codequality, webdev
Published: 2021-02-07 17:24:24

<h2> Before merging</h2>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0ggq58qzl8bvdcsmzd4k.png)

Have you heard about pdflib library, you didn't so here is the documentation page for you.

<h2>Pdflib package</h2>
<a href="https://www.npmjs.com/package/pdf-lib">Pdflib Package</a>

So here what I have done, First I have installed the package and Add this package to json file as usual. Then I have imported that package on code, Then I have used catch syntax to check for errors.

Then we need to load the pdf that we need to merge with the help of the load method inside the asynchronous function. If you want to get pdf as a user input then you can try multer package, but for now, I don't need it. I will provide a documentation link for multer package below.

<a href="https://www.npmjs.com/package/multer">Multer package</a>

Then, then with create() method, I have created a new empty document. And then I have added the first pdf file into that document with the help of copyPages() method. Once I have copied the first pdf, then I will concatenate the second pdf with the same copypage method. Then the pdf will get merged into that new document, and now it's time for naming a file. With the help of writeFileSync() I have synced the file and named it with .pdf extension. So here what the output looks like.

<h2> After merging </h2>
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/5u30460cv79gdmeyb6ki.png)

Thanks for taking the time to read my blog.
Happy coding :)