A long introduction to the Vite JS module bundler from Traversy Media
https://www.youtube.com/watch?v=89NJdbYTgJ8
#traversyMedia #vite #bundler
https://www.youtube.com/watch?v=89NJdbYTgJ8
#traversyMedia #vite #bundler
YouTube
Vite Crash Course | Faster Alternative To CRA
In this video, we will talk about the Vite JavaScript build tool. We will also compare it to Webpack as well as Create React App.
💻 Blog Post:
https://www.traversymedia.com/blog/vite-crash-course
⭐ All Courses:
https://traversymedia.com
💖 Show Support…
💻 Blog Post:
https://www.traversymedia.com/blog/vite-crash-course
⭐ All Courses:
https://traversymedia.com
💖 Show Support…
✨3 step breakdown of most FrontEnd Interview Rounds✨
[1] JavaScript Round - Interviewer will focus on core concepts, Output based Questions, Implementation based questions like Polyfills.
[2] Machine Coding (UI Round) - Interviewer will ask to design a UI Component focussing on your Thought process, Implementation, State Management of your Component.
[3] UI Tech Round - Senior Interviewer focusing on Browser Fundamentals, JavaScript & Async nature, Previous Projects.
#frontend #javascript #Interview
[1] JavaScript Round - Interviewer will focus on core concepts, Output based Questions, Implementation based questions like Polyfills.
[2] Machine Coding (UI Round) - Interviewer will ask to design a UI Component focussing on your Thought process, Implementation, State Management of your Component.
[3] UI Tech Round - Senior Interviewer focusing on Browser Fundamentals, JavaScript & Async nature, Previous Projects.
#frontend #javascript #Interview
Creating web applications with React JS, Three JS and Open AI API by JavaScript Mastery
https://youtu.be/ZqEa8fTxypQ
#nodejs #react #javascriptMastery
https://youtu.be/ZqEa8fTxypQ
#nodejs #react #javascriptMastery
YouTube
Build and Deploy an AI-Powered 3D Website Using React | 2024 Three JS Course Tutorial for Beginners
Many large corporations already use 3D graphics to showcase their products. Learn how to build your own ThreeJS 3D product website and infuse it with the power of artificial intelligence!
BUG: A "failed to load resource" error prevents the project from…
BUG: A "failed to load resource" error prevents the project from…
A guide to understanding how event loops and queues work in Node JS
https://www.builder.io/blog/visual-guide-to-nodejs-event-loop
----
How to remove node modules from projects that rarely open
https://dev.to/namaewayaman/delete-node-modules-like-a-pro-1m53
----
How to send large data from front end to backend
https://hsnice16.medium.com/send-large-files-from-frontend-to-the-backend-2f5f2414cc7c
Basic introduction to Express JS exercises
https://javascript.plainenglish.io/express-js-bootcamp-from-zero-to-web-server-in-one-hour-8cf80e1c42c6
#express #nodejs #eventLoop #nodemodules
https://www.builder.io/blog/visual-guide-to-nodejs-event-loop
----
How to remove node modules from projects that rarely open
https://dev.to/namaewayaman/delete-node-modules-like-a-pro-1m53
----
How to send large data from front end to backend
https://hsnice16.medium.com/send-large-files-from-frontend-to-the-backend-2f5f2414cc7c
Basic introduction to Express JS exercises
https://javascript.plainenglish.io/express-js-bootcamp-from-zero-to-web-server-in-one-hour-8cf80e1c42c6
#express #nodejs #eventLoop #nodemodules
Builder.io
A Complete Visual Guide to Understanding the Node.js Event Loop
You've been working with Node.js for a while. But there's something that's been nagging at you — the event loop. Learn more in this event loop guide.
A lengthy exercise from Code With Antonio creating a Twitter Clone with Next JS, Prisma ORM, and Tailwind CSS
https://www.youtube.com/watch?v=ytkG7RT6SvU
----
React JS application optimization tips
https://dev.to/devland/how-to-optimize-your-react-apps-performance-1045
----
#react #nextjs #tailwind #optimize
https://www.youtube.com/watch?v=ytkG7RT6SvU
----
React JS application optimization tips
https://dev.to/devland/how-to-optimize-your-react-apps-performance-1045
----
#react #nextjs #tailwind #optimize
YouTube
Build and Deploy: TWITTER clone with React, Tailwind, Next, Prisma, Mongo, NextAuth & Vercel (2023)
Discord for any problems/errors/bugs: https://www.codewithantonio.com/discord
Github & Live Website: https://www.codewithantonio.com/projects/social-media-platform
If you are having problems with "Edit" / "Follow" functionality throwing "Not Signed In"…
Github & Live Website: https://www.codewithantonio.com/projects/social-media-platform
If you are having problems with "Edit" / "Follow" functionality throwing "Not Signed In"…
Forwarded from Programming World👨💻
💫Some amazing Interview Experience Blogs which are one of the most upvoted on Leetcode💫
📍 Facebook interview experiences: https://bit.ly/3mE9zJz
📍 Amazon Final Interview Questions | SDE1: https://bit.ly/3A8rURW
📍 Amazon Behavioral questions | Leadership Principles: https://bit.ly/41HQl4z
📍 Google Onsite Backend Engineer Rejected: https://bit.ly/3ojW9Tj
📍 Facebook Phone Interview Questions: https://bit.ly/41x36io
📍 Bloomberg Phone Interview Questions: https://bit.ly/3orOaDA
📍 Amazon Online Assessment Questions: https://bit.ly/3mQ6ztl
📍 Amazon OOD [Design Unix File Search API]: https://bit.ly/3mNtA00
📍 How I got a Job Offer: https://bit.ly/3A8OQQX
📍 Flipkart | Machine Coding: https://bit.ly/43H2uIK
#Interview #MAANG
📍 Facebook interview experiences: https://bit.ly/3mE9zJz
📍 Amazon Final Interview Questions | SDE1: https://bit.ly/3A8rURW
📍 Amazon Behavioral questions | Leadership Principles: https://bit.ly/41HQl4z
📍 Google Onsite
📍 Facebook Phone Interview Questions: https://bit.ly/41x36io
📍 Bloomberg Phone Interview Questions: https://bit.ly/3orOaDA
📍 Amazon Online Assessment Questions: https://bit.ly/3mQ6ztl
📍 Amazon OOD [Design Unix File Search API]: https://bit.ly/3mNtA00
📍 How I got a Job Offer: https://bit.ly/3A8OQQX
📍 Flipkart | Machine Coding: https://bit.ly/43H2uIK
#Interview #MAANG
3 reasons you think FrontEnd Interviews are hard 🔥
[1] Solving Number of Questions - It’s just an outcome of JS concepts. Learning concepts first is One Time Investment to solve any questions.
[2] Coding all UI Components - It’s just some Logical State + UI + Approach Discussion. Understand Problem Statement, Component State & Flow, discussing with Interviewer.
[3] Learning Web Fundamentals overnight - It’s a constant process to make you a “Good Engineer”. Explore Browser APIs, Security Headers, Limitations, Caching, Rendering Techniques, Performance,..
#frontend
[1] Solving Number of Questions - It’s just an outcome of JS concepts. Learning concepts first is One Time Investment to solve any questions.
[2] Coding all UI Components - It’s just some Logical State + UI + Approach Discussion. Understand Problem Statement, Component State & Flow, discussing with Interviewer.
[3] Learning Web Fundamentals overnight - It’s a constant process to make you a “Good Engineer”. Explore Browser APIs, Security Headers, Limitations, Caching, Rendering Techniques, Performance,..
#frontend
Practice using OOP in JavaScript
https://www.freecodecamp.org/news/object-oriented-programming-javascript/
---
Practice using Date for date manipulation
https://javascript.plainenglish.io/mastering-date-serialization-deserialization-in-javascript-167472927992
---
Lesser known uses of Web API in JavaScript
https://javascript.plainenglish.io/5-rare-javascript-native-apis-4e407bb19703
----
Take a look at some of the new features of JavaScript ES2022 or ES13
https://javascript.plainenglish.io/6-amazing-and-useful-new-javascript-features-in-es13-b0719dfa0541
----
#oop #date #es13
https://www.freecodecamp.org/news/object-oriented-programming-javascript/
---
Practice using Date for date manipulation
https://javascript.plainenglish.io/mastering-date-serialization-deserialization-in-javascript-167472927992
---
Lesser known uses of Web API in JavaScript
https://javascript.plainenglish.io/5-rare-javascript-native-apis-4e407bb19703
----
Take a look at some of the new features of JavaScript ES2022 or ES13
https://javascript.plainenglish.io/6-amazing-and-useful-new-javascript-features-in-es13-b0719dfa0541
----
#oop #date #es13
freeCodeCamp.org
Object-Oriented Programming in JavaScript
Object-Oriented Programming is a programming style based on classes and objects. These group data (properties) and methods (actions) inside a box. OOP was developed to make code more flexible and easier to maintain. JavaScript is prototype-based proc...
Tips and tricks for using TypeScript for Next JS
https://blog.bitsrc.io/typescript-advanced-types-for-next-js-examples-and-best-practices-in-2023-a3a3946a353e
---
Using generic types in TypeScript
https://betterprogramming.pub/mastering-typescript-generics-unveiling-the-power-of-mapping-modifiers-and-key-mapping-b28d9d6bc296
---
Introduction to decorators in TypeScript
https://blog.logrocket.com/using-modern-decorators-typescript/
---
Convert Figma designs to Next JS web with Tailwind CSS
https://blog.logrocket.com/convert-figma-components-next-js-tailwind-css/
---
Preventing CSRF attacks on Next JS
https://blog.logrocket.com/protecting-next-js-apps-csrf-attacks/
---
#nextjs #typescript #tailwind #csrf
https://blog.bitsrc.io/typescript-advanced-types-for-next-js-examples-and-best-practices-in-2023-a3a3946a353e
---
Using generic types in TypeScript
https://betterprogramming.pub/mastering-typescript-generics-unveiling-the-power-of-mapping-modifiers-and-key-mapping-b28d9d6bc296
---
Introduction to decorators in TypeScript
https://blog.logrocket.com/using-modern-decorators-typescript/
---
Convert Figma designs to Next JS web with Tailwind CSS
https://blog.logrocket.com/convert-figma-components-next-js-tailwind-css/
---
Preventing CSRF attacks on Next JS
https://blog.logrocket.com/protecting-next-js-apps-csrf-attacks/
---
#nextjs #typescript #tailwind #csrf
Medium
TypeScript Advanced Types for Next.js: Examples and Best Practices In 2023
TypeScript utilities that can be useful for Next.js projects.
Introduction to Http requests in JavaScript
https://www.freecodecamp.org/news/http-full-course/
---
How to learn Javascript effectively and efficiently
https://www.freecodecamp.org/news/how-to-learn-javascript-effectively/
---
An introduction to Async Awaits and Promises in JavaScript
https://javascript.plainenglish.io/async-await-vs-promise-in-javascript-an-in-depth-comparison-bbbf084382e8
---
A collection of several text editor libraries to be installed on web pages
https://javascript.plainenglish.io/13-flexible-and-scalable-rich-text-editors-to-try-in-2023-e32a93aa8de1
#wysiwg #rtf #http #learn #tips
https://www.freecodecamp.org/news/http-full-course/
---
How to learn Javascript effectively and efficiently
https://www.freecodecamp.org/news/how-to-learn-javascript-effectively/
---
An introduction to Async Awaits and Promises in JavaScript
https://javascript.plainenglish.io/async-await-vs-promise-in-javascript-an-in-depth-comparison-bbbf084382e8
---
A collection of several text editor libraries to be installed on web pages
https://javascript.plainenglish.io/13-flexible-and-scalable-rich-text-editors-to-try-in-2023-e32a93aa8de1
#wysiwg #rtf #http #learn #tips
freeCodeCamp.org
HTTP Networking in JavaScript – Handbook for Beginners
HTTP is the backbone of the modern internet. In this text-based course, you'll learn how the HTTP protocol works and how it's used in real-world web development. All the code samples for this course are in JavaScript, but the networking concepts you'...
But if you can manage to learn:
1. The fundamental tools of the web (HTML, CSS, JavaScript + git)
2. Frameworks and metaframeworks like Tailwind, React / Vue and NextJS / NuxtJS
3. Soft skills like a great attitude, positive energy, honesty and great communication skills
Then you have what it takes to land that first front-end job.
And remember: You don't need to be an expert in all of these technologies. But having a basic understanding of how they all work together goes a long way.
1. The fundamental tools of the web (HTML, CSS, JavaScript + git)
2. Frameworks and metaframeworks like Tailwind, React / Vue and NextJS / NuxtJS
3. Soft skills like a great attitude, positive energy, honesty and great communication skills
Then you have what it takes to land that first front-end job.
And remember: You don't need to be an expert in all of these technologies. But having a basic understanding of how they all work together goes a long way.
The key when applying for development jobs is to stand out of the crowd.
Here's 3 easy ways to do just that:
→ A portfolio website with past projects and information about you
→ A LinkedIn account with a professional picture and bio
→ A GitHub profile showing your past activity and code
The first step is all about catching the interest of the company and getting to the interview stage. And with a good portfolio, you already have lots to talk about during the interview + you've shown your actual coding skills.
Here's 3 easy ways to do just that:
→ A portfolio website with past projects and information about you
→ A LinkedIn account with a professional picture and bio
→ A GitHub profile showing your past activity and code
The first step is all about catching the interest of the company and getting to the interview stage. And with a good portfolio, you already have lots to talk about during the interview + you've shown your actual coding skills.
Use this method to practice your front-end skills or learn a new framework like React or Vue🔥:
1. Google "public API's"
2. Pick any topic you like
3. Fetch some data from the API
4. Display the data in a simple UI
This will teach you a lot of fundamental skills like communicating with an external data source, handling loading/error states, and building intuitive user interfaces.
It'll also be more fun and motivating if you pick a topic you're personally interested in (books, movies, crypto etc.)
And of course you don't need to stop there - feel free to add any features you like. But now you have a solid starting point to work off of.
1. Google "public API's"
2. Pick any topic you like
3. Fetch some data from the API
4. Display the data in a simple UI
This will teach you a lot of fundamental skills like communicating with an external data source, handling loading/error states, and building intuitive user interfaces.
It'll also be more fun and motivating if you pick a topic you're personally interested in (books, movies, crypto etc.)
And of course you don't need to stop there - feel free to add any features you like. But now you have a solid starting point to work off of.
Forwarded from Programming World👨💻
25 Student TECH Programmes that you should think to be part of 👇
🔹 Google DSC
🔹 Microsoft Student Partner Program
🔹 CNCF ambassador program
🔹 Amazon Future Engineer Program
🔹 Swift Student Challenge - Apple
🔹 GitHub Campus Expert
🔹 AWS Educate Student Ambassador Program
🔹 Microsoft LEAP Apprenticeship Program
🔹 Oracle Student Ambassador Program
🔹 NVIDIA Deep Learning Institute SAP
🔹 Intel Student Ambassador Program
🔹 AnitaB .org Grace Hopper Celebration Scholarships
🔹 IBM Quantum Community Advocate Program
🔹 Red Hat Women in Open Source
🔹 Adobe Campus Leader Program
🔹 OnePlus Student Ambassador Program
🔹 Women Who Code Fellowship Program
🔹 VMware vExpert Program
🔹 Women Techmakers Scholars Program by Google
🔹 Google DSC
🔹 Microsoft Student Partner Program
🔹 CNCF ambassador program
🔹 Amazon Future Engineer Program
🔹 Swift Student Challenge - Apple
🔹 GitHub Campus Expert
🔹 AWS Educate Student Ambassador Program
🔹 Microsoft LEAP Apprenticeship Program
🔹 Oracle Student Ambassador Program
🔹 NVIDIA Deep Learning Institute SAP
🔹 Intel Student Ambassador Program
🔹 AnitaB .org Grace Hopper Celebration Scholarships
🔹 IBM Quantum Community Advocate Program
🔹 Red Hat Women in Open Source
🔹 Adobe Campus Leader Program
🔹 OnePlus Student Ambassador Program
🔹 Women Who Code Fellowship Program
🔹 VMware vExpert Program
🔹 Women Techmakers Scholars Program by Google
3 Steps on how to upskill & learn any New Tech as Frontend Engineer 🔥
1. Stop learning just the Code of the Tech. As you know with every version update Code changes. See React, lots of APIs have changed.
2. Every Framework, Library or Tech comes with a purpose to solve a problem. Learn what’s the problem. People don’t release just for show off of New Tech.
3. Don’t just jump to YouTube Tutorial, “15 mins of this Tech, that Tech”. Rather, refer Conferences, Talks, Tech Blogs, Podcasts by the Official People who‘ve built it (No one knows better than them ⚡️)
Source: LinkedIn
1. Stop learning just the Code of the Tech. As you know with every version update Code changes. See React, lots of APIs have changed.
2. Every Framework, Library or Tech comes with a purpose to solve a problem. Learn what’s the problem. People don’t release just for show off of New Tech.
3. Don’t just jump to YouTube Tutorial, “15 mins of this Tech, that Tech”. Rather, refer Conferences, Talks, Tech Blogs, Podcasts by the Official People who‘ve built it (No one knows better than them ⚡️)
Source: LinkedIn
Get to know how Promises work in JavaScript
https://www.freecodecamp.org/news/guide-to-javascript-promises/
---
An introduction to Nullish Coalescing in JavaScript
https://www.freecodecamp.org/news/what-is-the-nullish-coalescing-operator-in-javascript-and-how-is-it-useful/
---
A collection of very important JavaScript function snippets
https://levelup.gitconnected.com/20-extremely-useful-javascript-function-snippets-d8e7b0642ab9
---
Some web APIs that are rarely known
https://javascript.plainenglish.io/7-useful-javascript-web-apis-that-you-probably-dont-know-b766c613bab4
---
Introduction to Geolocation API in JavaScript
https://javascript.plainenglish.io/must-know-javascript-api-geolocation-api-f653f2d84b
---
#promise #webapi #nullishCoalescing #geolocation #snippet
https://www.freecodecamp.org/news/guide-to-javascript-promises/
---
An introduction to Nullish Coalescing in JavaScript
https://www.freecodecamp.org/news/what-is-the-nullish-coalescing-operator-in-javascript-and-how-is-it-useful/
---
A collection of very important JavaScript function snippets
https://levelup.gitconnected.com/20-extremely-useful-javascript-function-snippets-d8e7b0642ab9
---
Some web APIs that are rarely known
https://javascript.plainenglish.io/7-useful-javascript-web-apis-that-you-probably-dont-know-b766c613bab4
---
Introduction to Geolocation API in JavaScript
https://javascript.plainenglish.io/must-know-javascript-api-geolocation-api-f653f2d84b
---
#promise #webapi #nullishCoalescing #geolocation #snippet
Is DSA needed for Frontend web developers?
https://frontendpro.hashnode.dev/dsa-for-fe-devs
#dsa #frontend #algorithms #react
https://frontendpro.hashnode.dev/dsa-for-fe-devs
#dsa #frontend #algorithms #react
Sadanand Pai
DSA for Frontend devs
Is DSA needed for Frontend web developers?