Mario Souto

Eu já trabalhei com diversas ferramentas ao longo da minha carreira, frameworks linguagens... E recentemente eu questionei bastante os motivos de muita gente estar num hype bem grande em cima do Tailwind CSS. Então nesse vídeo eu trouxe um pouco da minha visão em cima da ferramenta, falando pontos que eu gostei e não gostei inclusive fazendo paralelos com o que eu uso hoje que ta mais próximo de CSS in JS.

Eu vejo muita gente entrando na área e se perguntando como faz pra ir crescendo na carreira, ir chegando a vagas empresas e projetos mais legais. Essa é uma pergunta dificil de responder, mas acho que conhecendo como outras pessoas fizeram da pra ter uma inspiração legal de ir escrevendo sua própria história. Então nesse vídeo eu conto pra vocês como consegui meu primeiro emprego como Programador!

Esses dias eu recebi um comentário falando que faltava um vídeo mais introdutório sobre NextJS aqui no canal então chegou a hora! Nesse vídeo tem tudo o que você precisa saber pra começar, o potencial da ferramenta e quero inspirar VOCÊ! a fazer seu próximo projeto com esse framework React pronto pra produção!

Já sofreu com erros na hora de salvar tokens, preferências de usuários e outros dados usando local storage no NextJS? É por que você ainda não viu esse vídeo! Hoje vou mostrar como trabalhar com cookies no NextJS de uma forma super decente e como você pode mesclar o trabalho com localStorage, entendendo o funcionamento da ferramenta e por que muitos passam por problemas fazendo isso, então senta na cadeira, pega a pipoca e não esquece de aperta o freio de mão do fusca em cima do botão de like e subscribe pra fortalecer a firma, valeu! 👊

Você ai, já precisou fazer botões de share nos seus projetos e fico bolado carregando o SDK do Facebook, Twitter e outras empresas? Seus problemas acabaram! Nesse vídeo mostro como fazer isso de uma forma super simples e com ZERO dependências, além de mostrar boas práticas para criar componentes com React e TypeScript! Bora ver?

Já parou pra pensar qual é o real trabalho de alguém que trabalha com programação? Durante muito tempo eu demorei pra entender e nesse vídeo eu quero compartilhar um pouco da minha visão da coisa, ainda faço paralelos com salário, crescimento e dicas de como você pode mostrar mais seu valor em uma próxima entrevista de emprego!

Ao longo de vários vídeo do canal eu sempre falei a importância de se manipular Arrays e Objetos. Nesse vídeo eu vou trazer um exemplo claro e como isso ficou mais paupável pra mim e abriu portas pra eu conseguir trabalhar com tranquilidade. Então se ajeita na cadeira, pega aquele copo de água e bora pro vídeo!

Semana passada eu lancei um vídeo apresentando como eu me organizo no Notion, seguindo nessa pegada, como prometido, trouxe um vídeo explicando como trabalhar com as Master Tags! A feature do Notion que me ajuda a categorizar de forma geral TODAS as coisas que eu trabalho mantendo uma consistência entre diferentes bancos de dados que eu uso na ferramenta. Falando assim parece super complexo, mas volta pro vídeo que você vai entender melhor 😍

Fala galera!!! A ideia dessa live super surpresa e aleatória é abrir essa caixa gigante que o GitHub mandou e ir conversando com vocês enquanto eu incluo a mais nova novidade do canal no meu site! Enquanto isso, já se inscreve na newsletter: https://mariosouto.com/newsletter/

Todo mundo que me conhece fala que eu so meio maluco por organização (e eu concordo) e finalmente com o notion sem escrever uma linha de código eu sinto que cheguei num nivel ABSURDO!!! E queria compartilhar qual a feature do Notion que tem me ajudado muito, num ponto de automatizar, estudos, lives, coisas que preciso fazer e inclusive minha newsletter! Que vou em um próximo vídeo explicar como to fazendo ela e inclusive, já se inscreve nela e receba toda semana os WeekLinks do DevSoutinho / +1 forma que to testando de trazer conteúdo com compromisso fixo de toda semana 1 email (sem spam é claro).

Já parou pra pensar que o webpack pode não estar resolvendo todos os problemas de performance que seu site tem? 😱 Na real ele nem resolve nada, o Babel faz boa parte do processo, mas para garantir funcionalidades de arrays e objetos nem ele acaba sendo o suficiente. Nesse vídeo vamos fazer uma tour sobre cobertura de browsers e como é importante entender como isso é feito para garantir que seu projeto vai rodar em browsers pré-históricos

Sabia que da pra publicar um site com HTML, CSS e JavaScript DE GRAÇA no GitHub e ainda vincular um dominio seu a ele? Nesse vídeo a gente vai aprender a publicar um projeto no GitHub do ZERO migrando ele a partir de simples arquivos HTML, CSS e JS.

Eu larguei o MacOS! Sim! Nesse vídeo eu conto por que e ainda de quebra mostro como ta um pouco do visual do meu setup atual pra gravação EEEE trago dicas do ferramental que eu to usando para trabalhar como Dev Front End!

Vocês pediram e chegou! Finalmente o vídeo integrando GraphQL no NextJS, com setup tranquilinho haha Vamos adicionar o suporte a GraphQL para facilitar integrações e vídeos futuros que quero trazer pro canal, além de cobrirmos como resolver um dos maiores erros cometidos em projetos NextJS quando o assunto é tamanho do HTML gerado. Bora ver?!

De cenário novo e pós mudança, ta chegando mais um vídeo com dicas de desenvolvimento dessa vez falando do Ngrok, a ferramenta que vai permitir vc compartilhar temporariamente qualquer porta localhost da sua máquina com qualquer pessoa no mundo! Bora ver?

No vídeo de hoje vamos fazer uma tour pelas minha features favoritas da linguagem com exemplos práticos de como aplicá-las no dia a dia, ainda de quebra reviso e comento algumas coisas legais que estão por vir no TC39 e por consequência na própria linguagem JavaScript! Se eu fosse você voltava logo pro vídeo e terminava de assistir!

In this video, I introduce some amazing GitHub features like issues, pull requests, PR reviews code suggestions, and other amazing stuff \o/

In this video, I share how amazing was the GitHub Stars box that I receive through the program with the open version of my serie ""Git and GitHub for survival" that is in this playlist https://www.youtube.com/watch?v=BAmvmaKQklQ&list=PLh2Y_pKOa4Uf-cUQOVNGlz_GVHx8QYoE6

In this video, as the past one explain merge in this one I explain how rebase works, everyone fears it one time in life and my idea here is let things clear :D

In this video, I explain how to create a markdown reader to enable a blog creation on top of NextJS and GitHub

In this video, I explain how merge works in git, with visual samples and code ones also!

In this video I use https://git-school.github.io/visualizing-git/#free-remote to teach sample git working flows to teach people how important is to have a visualization about what is happening in our commit history and make people lose fear.

In this video I open .git folder and explain how things work in internals

Inspired by the last video, in this one I teach how to create a universal code executor running on NodeJS and running Python and JavaScript code until the end of the video. It's the starting of a brand new serie

In this video, I teach how to create a tooltip with Styled Components enforcing good practices of accessibility (wai-aria).

In this video I teach how to use GitHub CodeSpaces and explain how amazing is the environment provided by GitHub with this VS Code running on browser and how amazing is the setup to test front end projectrs.

In this video I introduce how to go beyond stackoverflow to solve code problems using GitHub features like issues and looking directly into source code.

In this video I teach how to create a robot with puppeteer and how to use it to make complex things interacting with UIs, doing login and other stuff.

In this video I share my experience using Conventional Commits with Semantic Release in my git projects.

In this video, I introduce TDD without writing any test! The main idea is to share how TDD is a way of thinking and not only a coding technique

In this video, I introduce how to use Styled Components and how amazing is to use it in React projects :D

In this video I explain how to manage PROD and DEV env values with NodeJS and JavaScript

In this video I explain the importance to have trailing slash in websites and the impacts of analytics tools because of it, the importance to have headers, and how to avoid clickjacking vulnerability.

In this video, I make a quick tour through Front End history to reach a conclusion if the profession is going to end or to have a new transformation.

In this vídeo I explain how I organize my studies and how I use notion to it.

In this video I explain how I imagine a front end project and how to organize it design system based with React and NextJS

In this video, I explain alternatives to typeof in JavaScript to validate types

In this video, I explain how to use Lottie with React to create beautiful animations!

In this video I explain how to make screen transitions in React Native with React Navigation

In this video, I give some tips about how to create a portfolio using the Wayback machine and tips about where to get project ideas and layouts.

In this video, I implement the validation API of Formik

This was the opening of a free React JS course that I developed with Ju Negreiros and Marco Bruno. We analyze Spotify, Ifood, and Netflix websites speaking about front end, performance, and other stuff related.

In this video, I explain how to make the stagger effect with JavaScript, React, and Styled Components

In this video I explain how to use React, NextJS and how to integrate with Google Spreadsheets.

In this video I reimplement the React render API to show that libraries are not magic

In this video, I recreate the Spotify UI with styled-components explaining how I organize my style components

In this video, I explain how Formik base API works reimplementing it with react custom hooks

The main idea of this video is to explain base JavaScript knowledge to have before start to learn a JavaScript framework

In this video, I explain how to generate static apps with NextJS

In this video, I explain how to use Github Readme Badges and how an open-source project should be organized

In this video, I explain why NextJS is amazing for SEO and give performance tips based on Vercel structures

In this video I explain how to use strategy in javascript with a game example

In this video, I explain how to make lazy loading and scroll animation effects with JavaScript and scroll events.

In this interview, I explain how to make Front End testing invited by Rodrigo Branas.

In this video, I explain how to draw obstacles in endless run games

In this video I explain how to create the base of Spotify UI with Styled Components, React Native and show how to code based in a Figma Layout

In this video, I explain how to make the draw effect with SVG and CSS

In this video, I explain how to start the creation of a Spotify + Pocketcast clone app with JavaScript, React Native, and Expo

In this video I explain how to make endless runner games with JavaScript and Canvas.

In this video, I explain how to use a puppeteer to create a robot that makes monetary conversion through the google website

In this video I explain about game development with JavaScript, the content is relative to collision, jumps and web audio api

In this video I explain how to use browser APIs to simulate the material design ripple effect

In this video I explain how gravity works and develop it with JavaScript and canvas

In this video I explain how to centralize in CSS vertical, horizontally and explain a little bit about why css has multiple ways to centralize stuff.

I explain how forEach an map works behind the scenes implementing them to explain how people can use it with this knowledge.

I create a YouTube video explaining how to add an easter egg to a website with JavaScript and use it to explain the debounce pattern.

In this video I explain how to create a game with JavaScript showing the canvas tag and how to create elements and add images to it.