
Weekly Code Quickies
By Norbert BM

Weekly Code QuickiesFeb 26, 2023

Is CSS making Sass obsolete | WCQ 34
In this episode, we explore the question of whether CSS is making Sass obsolete in front-end web development. We examine the advantages and disadvantages of both CSS and Sass and provide insights on which option may be best for your project.
👇 My Website / Courses / Podcast / Tutorials / Projects / Blog: 👨🏫 :
https://norbertbm.com/web-development/web-dev-courses/
Complete Article:
https://norbertbm.com/is-css-making-sass-obsolete-a-look-at-the-pros-and-cons/
------------------------------------------------------------------------------------------------- Timestamps: 00:00 - Intro & Project overview 00:41 - Variable in CSS vs Sass / Scss 01:37 - Nesting in CSS vs Sass / Scss 02:49 - Mixins, Extends, functions in CSS vs Sass / Scss 03:38 - Importing in CSS vs Sass / Scss 04:40 - Is CSS better then SASS ?
------------------------------------------------------------------------------------------------- Sponsors: ------------------------------------------------------------------------------------------------- #CSSvsSass #LearnCSS #norbertbmwebdevelopment

Is The GitHub Copilot Killer The FREE Amazon Code Whisperer | WCQ33 |
In this episode of the podcast I will analyze the new Amazon CodeWhisperer and GitHub Copilot X What are the pros and cos, how to install it, price, and more. 👇 My Website / Courses / Podcast / Tutorials / Projects / Blog: 👨🏫 : https://norbertbm.com/web-development/web-dev-courses/ ------------------------------------------------------------------------------------------------- Useful Links: https://aws.amazon.com/codewhisperer/https://marketplace.visualstudio.com/items?itemName=AmazonWebServices.aws-toolkit-vscodehttps://plugins.jetbrains.com/plugin/11349-aws-toolkit ------------------------------------------------------------------------------------------------- Timestamps: 00:00 - Intro & Project overview 01:00 - How to install and Use Amazon CodeWhisperer 03:00 - What is GitHub Copilot X ------------------------------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------- #GitHubCopilot #AmazonCodeWhisperer #AI

Top 10 ways to EARN MONEY with OpenAI's ChatGPT | Analysis | WCQ32
Learn how to earn money with OpenAI's ChatGPT analysis with these top 10 tips and strategies. ChatGPT is a cutting-edge AI technology that can be used for various applications, including business and finance. In this video, we will explore the most effective ways to leverage ChatGPT to generate income and grow your business.

Top 10 skills web developers will need in 2023 - WCQ30
In this video, we'll be exploring the top 10 skills that web developers will need to stay ahead of the game in 2023. As technology continues to evolve at an unprecedented pace, it's essential for web developers to remain up-to-date with the latest trends and technologies to build robust, scalable, and user-friendly web applications.
We'll be covering a range of topics, including front-end and back-end development, cloud computing, artificial intelligence, and more. Whether you're a seasoned developer or just getting started, this video is sure to provide valuable insights and practical tips to help you succeed in the fast-paced world of web development.
So if you're ready to take your web development skills to the next level and stay ahead of the curve, be sure to tune in to our Top 10 Skills Web Developers Will Need in 2023 video!
Time Stemps :
00:40 - Proficiency in JavaScript
01:14 - Responsive Design
02:17 - Cybersecurity
03:01 - UI/UX Design
04:00 - Cloud Computing
04:41 - Version Control
05:30 - AI and Machine Learning
06:31 - Server-Side Programming
07:14 - Agile Methodology
08:16 - Communication

GitHub Copilot, Windows Mac BING, Junoior DEVs and Students
GitHub Copilot the good the bad, and the ugly, Windows on Mac BING on the down fall, Top countrie in europe for Junoior devs and students
Welcome to WCQ, in this episode:
- GitHub's Copilot improving its AI model and capabilities but old problems still frustrate DEV's.
- Microsoft Windows now Officially suportetd on Mac's with Apple silicon, but also takes a huge hit in the stock market after BING looses controle.
- Junior devs and students are favoring this European country for study and starting their careers.

Microsoft ChatGPT vs Google AI Bard and GitHub layoffs 10%
Compare Microsoft's ChatGPT with Google's AI Bard and stay updated on the latest tech news with our coverage of the 10% layoffs at GitHub. Discover the strengths and weaknesses of each AI technology and how they stack up against each other. Stay informed and make informed decisions with our in-depth analysis.

ChatGPT subscription, CSS has, is , not and Activision Blizzard Microsoft - WCQ27 2023
Join the ChatGPT revolution with the latest ChatGPT Subscription! This powerful language model is trained by OpenAI, making it easier than ever to automate and streamline your work. Don't miss out on this opportunity to enhance your workflow - subscribe today!
CSS pseudo-class rise in popularity: has(), is(), not() gaining more and more Global browser support.
Plus, learn about the recent collaboration with Activision Blizzard and Microsoft for WCQ27 2023. Watch now!
YouTube Video : https://youtu.be/jGS27WehIjs
Show notes:
- 00:00 - Introduction
- 00:31- What is Open AI ChatGPT subscription
- 01:03 - What do you get for subscribing to ChatGPT Plus
- 02:59 - Visual Studio Code Insiders VS Regular
- 04:32 - CSS :has(), is() , :not() Selectors
- 05:03 - What is the CSS has() pseudo-class browser support
- 05:34 - What is the CSS is() pseudo-class browser support
- 06:05 - What is the CSS not() pseudo-class browser support
- 07:19 - Microsoft under pressure from EU for Activision Blizzard deal
- 09:35 - WoW lead fired by Blizzard

Reacting to The state of JS 2022 - WCQ26
The State of JavaScript 2022 report is an annual survey that aims to understand the current state of the JavaScript ecosystem. This report provides an overview of the most popular JavaScript frameworks, libraries, and tools, as well as the latest trends and future predictions. One of the biggest takeaways from the State of JavaScript 2022 report is the continued dominance of React.
My Udemy Courses:
- 30+ React Projects, Learn React JS by Building 30+ Web Apps: https://www.udemy.com/course/30-react...
- Advanced HTML CSS & SASS - Build and Deploy Modern Websites: https://www.udemy.com/course/advanced...
- Git & GitHub -Essentials for Version Control & Management Complete: https://www.udemy.com/course/essentia...
- Bootstrap 5 for Beginners with real world Projects: https://www.udemy.com/course/complete...
- 30 HTML CSS & JavaScript projects in 30 Days for Beginners: https://www.udemy.com/course/30-html-...
- Visual Studio Code - Master the Complete VS Code environment: https://www.udemy.com/course/visual-s...
- Master Responsive Web Design CSS Grid, Flexbox & Animations: https://www.udemy.com/course/master-r...
- Modern JavaScript from Beginner to Advanced: https://www.udemy.com/course/modern-j...
- Advanced CSS & SASS: Framework, Flexbox, Grid, Animations: https://www.udemy.com/course/advanced...
- Web Development HTML CSS & JS a Beginner to Advance guide: https://www.udemy.com/course/advanced...
-----------------------------------------------------------------------------
👇 Website / Tutorials / Projects /Blog 👨🏫
https://norbertbm.com/web-development...
Show notes:- 00:00 - Introduction
- 01:55 - “Yearly Salary” vs “Years of Experience” for JavaScript developers
- 07:12 - Demographics Country and Language of JavaScript developers
- 09:39 - Top used JavaScript Features going in to 2023 1
- 2:00 - Top JavaScript Libraries going in to 2023
- 12:32 - Top Front-end Frameworks going in to 2023
- 13:25 - Top Rendering Frameworks going in to 2023
- 15:38 - Top JS Mobile and Desktop going in to 2023
- 17:10 - Usage of JavaScript vs TypeScript going in to 2023
- 17:56 - Where to learn JavaScript in 2023
Check out the State of JS 2022 here:
#stateofjs2022 #javascript2023 #WCQ

What is the Difference between Beginner vs Intermediate vs Advanced programmer
In this video, we're going to discuss what it takes to become a professional programmer. We'll cover the basics of what it takes to become a professional programmer, as well as some of the benefits that come with this career.
If you're interested in becoming a professional programmer, then this video is for you! We'll discuss what it takes to become a professional programmer, cover the basics mistakes and give you some tips on how to avoid them. Whether you're a beginner or a professional programmer, this video is a great way to learn more about this career!
🎱Blog Post for this Video:https://norbertbm.com/
-----------------------------------------------------------------------------
👇 Website & Courses: 👨🏫 :https://norbertbm.com/web-development/web-dev-courses/Podcast:https://anchor.fm/menyhart-b-norbert9
------------------------------------------------------------------------------------------------- Timestamps: 00:00 - Intro 01:00 - Beginner VS Intermediate Programmer 03:00 - Intermediate VS Advanced Programmer 07:40 - About My upcoming React Course ----------------------------------------------------------------------------------------------------------------------------------------------------------------- #programmingforbeginners #howtolearntocode #norbertbmwebdevelopment

Create a website with scroll animation
Learn how to create a website with scroll animation using HTML CSS and JavaScript with its Intersection Observer API
🎱Source Code for this Video:
https://norbertbm.com/scroll-animated-website/
-----------------------------------------------------------------------------
👇 Website & Courses:
👨🏫 : https://norbertbm.com/web-development/web-dev-courses/
Podcast: https://www.youtube.com/channel/UCDKBcl1m__Oj7C5O-orhn_w
-------------------------------------------------------------------------------------------------
Timestamps:
00:00 - Intro & Project overview
02:00 - Basic Setup HTML and CSS
05:25 - using Intersection Observer API
08:42 - delay transition effect with css
-------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------
#SrollAnimation #javascriptproject #WebsiteAnimation

What is ASTRO JS & How To Run it
Learn what the Astra Framework is and how to run Astro and create your first Astro blog website.
# What is Astro and How to use it
Your assignment, build a Blog website, ok , let me do a `npx create-react-app my-blog` and do a total overkill of your assignment.
Or just use Astro, with is similar to a static site generator and make you life much easear.
## What is Astro?
Astro is an all-in-one web framework for building fast, content-focused websites.
For example Blogs, Landing pages ,Portfolio, Showcase, etc...
## Key Features:
Some of the Key Features of the Astro framework are :
- **Component Islands**: A new web architecture for building faster websites, that considers your website as the ocean and the components as islands.
- **Server-first API design**: opposite to next.js, expensive hydration is removed of your users’ devices increasing site speed.
- **Zero JS, by default**: No JavaScript runtime overhead to slow you down. JavaScript is loaded only when required.
- **Edge-ready**: can run on global edge runtime like Deno or Cloudflare.
- **Customizable**: Tailwind, MDX, and 100+ other integrations to choose from.
- **UI-agnostic**: Supports React, Preact, Svelte, Vue, Solid, Lit and more as integrable components.
There main selling point is that you ship les JavaScript!
🎱Source Code for this Video: https://norbertbm.com/
👇
Website & Courses: 👨🏫 : https://norbertbm.com/web-development/web-dev-courses/
Podcast: https://www.youtube.com/channel/UCDKBcl1m__Oj7C5O-orhn_w

How to write good code
In this web development tips and tricks I will share my thought on how to write better code.

React JS Explained
Learn what react is and how to create your first react app in this web development tutorial. React (also known as React.js or ReactJS) is a free and open-source front-end JavaScript Framework, or kind of.
Actually React is a JavaScript library that is declarative, efficient, and flexible for building user interfaces. It lets you compose complex UIs from small and isolated pieces of code called “components”.
It is maintained by Meta (formerly Facebook) and a community of individual developers and companies.
React can be used as a base in the development of single-page, mobile, or server-rendered applications with frameworks like Next.js.
Watch the full video Tutorial:
https://youtu.be/il34iLY6o2s

WWDC 2022 Apple iOS and MAC's for Web Development.
Is Apple viable for Web Development in 2022 with ist new M2 silicon Chip. iOS 16 and MacOS Ventura, also new MacBook Air and MacBook Pro for Web Developers and coding.

React version 18 | What is new in React v18 | How to Install Update and run React JS v18
In this React tutorial you are going to learn how to install update and run react version 18
💖 Support The Channel by becoming a part of this community!
🎱 Code for this Video: https://norbertbm.com/
-----------------------------------------------------------------------------
👇 Website & Courses: 👨🏫 :
https://norbertbm.com/web-development/web-dev-courses/
-------------------------------------------------------------------------------------------------
Timestamps:
00:00 - Intro
00:40 - What is new in React 18
01:22 - React create root method
02:10 - React 18 new Hooks
02:42 - React useId hook
03:03 - React startStransition and useTransition Hooks
03:34 - React useDeferredValue hook
4:04 - React useSyncExternalStore
04:35 - React useInsertionEffect
05:06 - How to Update React from v17 to v18
05:40 - How to instal react v18
06:07 - How to implement react createRoot method
07:55 - How to instal and Run React V18
#ReactV18 #ReactNews #norbertbmwebdevelopment

Top 10 Skills You Must Know 2022 Before You Learn ReactJS
Here is what you should know in JavaScript before starting to learn the React JS Framework. 💖 Support The Channel by becoming a part of this community! 🎱 Outlet for this Video and PDF: https://norbertbm.com/top-10-skills-you-must-know-2022-before-you-learn-reactjs/----------------------------------------------------------------------------- 👨🏫 Check out my Website for more tutorials and Udemy Course👨🏫 : https://volere.life/web-development/web-dev-courses/ ------------------------------------------------------------------------------------------------- Timestamps: 00:00 - Intro & Project overview 00:47 - What are javascript template literals , template strings 01:36 - JavaScript Shorthand property names 02:08 - JavaScript Arrow functions 02:53 - What is JavaScript Destructuring 03:23 - JavaScript Parameter defaults 03:54 - JavaScript Rest/Spread 04:50 - JavaScript ESModules 06:19 - JavaScript Ternaries 06:51 - JavaScript Array Methods 07:28 - JavaScript Promises and async/await

Blockchain in a nutshell WCQ17
In this episode we will explain what blockchain is, how it works, what proof of work in a blockchain is and if Blockchain is secure.
Watch it on youtube: https://youtu.be/Pby0lta2cN0

Ethereum In A Nutshell | WCQ16
In this episode we are going to explain Ethereum
- When was Ethereum invented
- What is Ethereum
- How dose Ethereum Work
- What is Ether
- What is Gas in the Ethereum blockchain
- Conclusion

Bitcoin in a Nutshell | WCQ15
In todays episode you will learn about Bitcoin, what bitcoin is, who created it, how bitcoin works , haw to own bitcoin, how to mine bitcoin and where to store bitcoin. Also as a conclusion at the end, the ups and down or the pros and cons of Bitcoin.

Top Benefits of micro Frontend Web Development in 2022 - WCQ14
In todays episode we will take a look at the benefits of Micro Frontend! Throughout this episode I will cover :
What are Micro Frontends?
How Micro Frontend Works?
What are the Best Practices of Micro-Frontend?
How to Adopt Micro Frontend Architecture?
Why Micro Frontend Matters?
What are the Benefits of Micro Frontend Architecture?
Concluding Micro Frontend Architecture

Top 5 Technologies for WEB Development in 2022 - WCQ13
In this episode of the Weekly Code Quickies Podcast we will take a look at the latest trends for 2022 for web development like: No-code, Data base, JavaScript, WEB 3.0, Metaverse.
Support the channel by subscribing!
---------------------------------------------------------------------------------------------------------------------
Listen to the podcast on: Apple Podcasts: https://podcasts.apple.com/de/podcast/weekly-code-quickies-with-norbert-b-m/id1455776215Spotify: https://open.spotify.com/show/1bpbmoaP44RGq9rDqaat4R?si=76134374af6d495dStitcher: https://listen.stitcher.com/yvap/?af_dp=stitcher://show/380154&af_web_dp=https://www.stitcher.com/show/380154---------------------------------------------------------------------------------------------------------------------
Show notes:
00:00 - Introduction
00:42 - NO CODE web development
01:47 - Database
04:35 - AI in web development
05:32 - JavaScript the foundation of all Frameworks
06:17 - Web 3.0
08:08 - Metaverse
#2022 #webdevelopmen #WCQ

New JavaScript Framework Remix, React Router 6 - WCQ12
In this episode of Weekly code quickies we will take a look at Remix the New, Free and Open source JavaScript Framework, and React Router V6
---------------------------------------------------------------------------------------------------------------------
Watch it on YouTube:
https://youtu.be/ruSwu1VLoEg
---------------------------------------------------------------------------------------------------------------------
Show notes:
00:00 - Introduction
01:04 - What is remix?
01:40 - Remix is Server-side rendered
02:10 - Remix is not part of the JAM Stack
02:40 - What are the Benefits of Remix
03:10 - What are the use case of Remix
03:40 - How to get Started with Remix
04:10 - React Router V6 What is React Router ?
05:16 - How to set up React Router 6
06:12 - What is New to React Router 6 ?
#RemixFramework #ReactRouter6 #WCQ

Web 3 / Metaverse, New Framework Hydrogen for dynamic E-commerce - WCQ11

The future of coding, NodeJS in the browser and WebContainers - WCQ November 15, 2021
In this episode we will talk about the potential future of web development, witch could take place in the browser instead of traditional IDE app.
---------------------------------------------------------------------------------------------------------------------
Watch it on YouTube: https://youtu.be/PPJQSZJyvCg
---------------------------------------------------------------------------------------------------------------------
Show notes:
00:00 - Introduction
01:31 - Topics
01:51 - What are web containers
02:56 - Node.js in the browser
03:53 - What is a IDE
04:23 - What is StackBlitz
05:05 - Properties of StackBlitz
06:10 - FRONT-END FRAMEWORKS & LIBRARIES in StackBlitz
06:47 - BACK-END in StackBlitz
#webcontainers #stackblitz #WCQ

Is Web 3.0 the future of the internet, should you even care blockchain?
Web 3.0, You may have heard of it, but what is it? Should you even care about it and do we really need another version of the internet? What's wrong with Web 2.0, witch is the current version of the internet and its predecessor Web 1.0? Are there any benefits to Web 3.0?
In this episode of the podcast I will try to answer all of this questions. And if wish to learn about the current fastest growing then Technology then stick around to the end!
Whatch it on YouTube: https://youtu.be/zN_fpvp_EVk
Summery
Is Web 3.0 the future of the internet, should you even care?Summery
What is the Web 1.0
What is Web 2.0What is the problem with Web 2.0?
What is Web 3.0The concept of Web 3.0
Web 3.0 Will Use AI
Web 3.0 will return to the Original Concept
Why Web 3.0 Matters
What is Blockchain, the fastest growing web technology.Enter the blockchain
Blockchain VS typical database

Facebook is going Meta, get ready User One!
The company that owns Instagram, WhatsApp and Facebook called facebook, is as of Oct 28 known as Meta.

New Macbook Pro M1 Max and VS Code WEB APP
New apple Macbook pro m1 max release and Microsoft visual studio code web application in the browser
-------------------------------------------------------------------------------------------------
Check out the video on my youtube : https://youtu.be/kQ5ionTNzbo
Timestamps:
00:00 - Intro & overview
00:18 - New VS Code Web app in the browser
01:08 - Limitations of VS Code web app
02:14 - Advantages of VS Code web app
03:23 - First look at vs code web app
08:37 - New Macbook pro 16'' M1 Max

Vs Code v1.61 September 2021 updated & Font Awesome V6 Beta - WCQ Ep6
In todays episode we are going to take a look at the new Visual Studio Code Aka VS Code Version 1.61 September 2021 updates and at Font Awesome V6 BETA.
Watch the full episode on YouTube: https://youtu.be/HGhLHGDFeck
Timestamps:
00:00 - Introduction
00:38 - What is Visual studio code?
00:49 - VS Code September 2021 version 1.61 updates overview
01:37 - Vs Code Split editors within the same group
01:59 - VS Code-Locked editor groups
02:06 - VS Code-Better display of deleted and readonly files
02:23 - VS Code Bracket pair guides
02:43 - VS Code-Fixed terminal dimensions
03:00 - VS Code - Jupyter Notebook improvements
03:30 - VS Code-Platform-specific extensions
03:47 - VS Code - Virtual Workspaces extension guide
04:11 - VS Code - Advanced container configuration
04:36 - Font Awesome V6 Beta
04:44 - What is Font Awesome

Top 10 tips for beginner web developers
This one is for all you beginner web developers. In this episode I will give you my personal top 10 tips for you if you wish to start your career as a web developer.
Watch the full episode on YouTube: https://youtu.be/o3IFf-9DQL8
![How Old are programing [ coding ] languages](https://d3t3ozftmdmh3i.cloudfront.net/production/podcast_uploaded_nologo400/1434363/1434363-1632831848535-6b06eede021dc.jpg)
How Old are programing [ coding ] languages
In this episode we are going to go through some of the most popular coding / programing languages like C, C++, C#, Java, JavaScript, HTML, CSS Pythone, Rupy, Rust, and more. And define what they stand for, when they ware released and how old they are.
Check out the full episode on youtube: https://youtu.be/UY0FR6_Xw_k
💖 Support The Channel by becoming a patreon! https://www.patreon.com/user?u=49022497
-------------------------------------------------------------------------------------------------
Full blog post : https://wp.me/pakj3t-14W
👨🏫 Check out my Website for more Tutorials and Udemy Course👨🏫 : https://volere.life/web-development/web-dev-courses/

5 Tips for improving your web development skills
In this Weekly Code Quickies I will give you 5 Tips for improving your web development skills.
💖 Support The Channel by becoming a patreon! https://www.patreon.com/user?u=49022497 🎱 Resources for this Video: https://volere.life/5-tips-for-improving-your-web-development-skills/ ----------------------------------------------------------------------------- 👨🏫 Check out my Website for more tutorials and 👨🏫 Udemy Course : https://volere.life/web-development/web-dev-courses/

8 Useful JavaScript Array Methods
In this Weekly Code Quickies we will learn about the 8 most Useful JavaScript Array Methods: JavaScript Filter () method JavaScript Map () method JavaScript Find() method JavaScript forEach () method JavaScript some() method JavaScript every () method JavaScript reduce() method JavaScript includes() method
👨🏫 Check out my Website for more tutorials and 👨🏫 Udemy Course : https://volere.life/web-development/web-dev-courses/

Windows 11 for coding and programing
In todays Weekly Code Quickies we are going to take a first look at windows 11 and if it is any good for coding and programing
Timestamps: 0:00 - Intro 0:37 - Will windows 11 increase coding performance 1:30 - What are window 11 Improvements 1:35 - What is windows 11 snap layouts 2:04 - Windows 11 multi monitor setup 3:38 - Windows 11 with integrated Microsoft Teams for communication 4:24 - Conclusions about Windows 11
💖 Support The Channel by becoming a patreon! https://www.patreon.com/user?u=49022497
👨🏫 Check out my Website for more tutorials and Udemy Course👨🏫 : https://volere.life/web-development/web-dev-courses/