Project ideas at each level👇
📌 HTML
- Simple portfolio
📌 CSS
- Portfolio with styling
- Tribute page
- Parallax Website
📌 CSS framework
- Landing page
- Survey forms
📌 JavaScript
- Clock
- Navigation bar
- TO-DO app
- Quiz app
- Blog
- Animated menu
- Tic Tac Toe
📌 HTML
- Simple portfolio
📌 CSS
- Portfolio with styling
- Tribute page
- Parallax Website
📌 CSS framework
- Landing page
- Survey forms
📌 JavaScript
- Clock
- Navigation bar
- TO-DO app
- Quiz app
- Blog
- Animated menu
- Tic Tac Toe
Forwarded from Learn CSS™
If you know CSS then you can use these amazing generators and save your time
1️⃣ CSS Box Shadow Generator
- Generate CSS3 Box Shadow code for your Div, Frame, Buttons or any other HTML element with Outline, and Inset (inner) type shadow effects
🔗 https://cssboxshadow.com/
2️⃣ Glassmorphism
- Generate glassmorphic design easily
🔗 https://glassgenerator.netlify.app/
3️⃣ Cool Backgrounds
- Explore a beautifully curated selection of cool backgrounds that you can add to your next project
🔗 https://coolbackgrounds.io/
4️⃣ Pixel art
- Create CSS pixel art, export the results to CSS and download them.
🔗 https://www.pixelartcss.com/
5️⃣ SVG waves
- It's not a CSS generator but very handy tool. You can create the layers of waves and simply export either in SVG or PNG
🔗 https://svgwave.in/
1️⃣ CSS Box Shadow Generator
- Generate CSS3 Box Shadow code for your Div, Frame, Buttons or any other HTML element with Outline, and Inset (inner) type shadow effects
🔗 https://cssboxshadow.com/
2️⃣ Glassmorphism
- Generate glassmorphic design easily
🔗 https://glassgenerator.netlify.app/
3️⃣ Cool Backgrounds
- Explore a beautifully curated selection of cool backgrounds that you can add to your next project
🔗 https://coolbackgrounds.io/
4️⃣ Pixel art
- Create CSS pixel art, export the results to CSS and download them.
🔗 https://www.pixelartcss.com/
5️⃣ SVG waves
- It's not a CSS generator but very handy tool. You can create the layers of waves and simply export either in SVG or PNG
🔗 https://svgwave.in/
Free illustrations for your next project 💫
⪼
⪼
⪼
⪼
⪼
⪼
⪼
⪼
⪼
⪼
⪼
stubborn.fun⪼
freeillustrations .xyz⪼
illlustrations .co⪼
undraw .co⪼
vectr .com⪼
drawkit .io⪼
opendoodles .com⪼
freewebillustrations .com⪼
handz .design⪼
icons8 .com/illustrationsI just came across an amazing GitHub repository.
In this repo, You'll find a lot of great resources for front-end developers including
- Frameworks
- Books
- Challenges
- Tools
- Blogs, etc..
🔗 https://github.com/RitikPatni/Front-End-Web-Development-Resources
In this repo, You'll find a lot of great resources for front-end developers including
- Frameworks
- Books
- Challenges
- Tools
- Blogs, etc..
🔗 https://github.com/RitikPatni/Front-End-Web-Development-Resources
✨5 annoying JavaScript habits that you want to avoid.✨
https://telegra.ph/5-annoying-JavaScript-habits-that-you-want-to-avoid-03-25
https://telegra.ph/5-annoying-JavaScript-habits-that-you-want-to-avoid-03-25
Telegraph
5 annoying JavaScript habits that you want to avoid.
5 annoying JavaScript habits that you want to avoid. I see these 5 over and over. They are bad for performance, readability, and they signal a lack of basic understanding of the JavaScript language. Let me go through them here👇 1. Using map() instead of forEach().…
JavaScript Tip 💡
IIFEs died when modules were born.
Let them rest in peace.
You don’t need them.
In a case like this, just execute the function on a new line instead 🙌
IIFEs died when modules were born.
Let them rest in peace.
You don’t need them.
In a case like this, just execute the function on a new line instead 🙌
You want to learn the basics of JavaScript?
Here is an awesome GitHub repository that teaches you the basics of JavaScript in 30 days
This is a step by step guide/roadmap followed by a few small projects
Link🔗 -
https://github.com/Asabeneh/30-Days-Of-JavaScript
Here is an awesome GitHub repository that teaches you the basics of JavaScript in 30 days
This is a step by step guide/roadmap followed by a few small projects
Link🔗 -
https://github.com/Asabeneh/30-Days-Of-JavaScript
7 Unique APIs for your next project -
1. Shodan API
2. Radar .io API
3. WebHose API
4. People Data Labs
5. Crawlera
6. SpaceX API
7. Segment
*Whether you want something to help you get a job or create a side project that earns you some money, all of these APIs are valuable*
1. Shodan API
2. Radar .io API
3. WebHose API
4. People Data Labs
5. Crawlera
6. SpaceX API
7. Segment
*Whether you want something to help you get a job or create a side project that earns you some money, all of these APIs are valuable*
JavaScript Tips & Tricks : BigInt
How would you deal with numbers larger than MAX_SAFE_INTEGER or 9007199254740991?
BigInt comes to your aid
#Javascripttip
How would you deal with numbers larger than MAX_SAFE_INTEGER or 9007199254740991?
BigInt comes to your aid
#Javascripttip
This media is not supported in your browser
VIEW IN TELEGRAM
VS CODE PATH TRICK W/ JavaScript
Use path mapping to avoid fumbling over long relative module imports in your JavaScript code. Just create a JSconfig.json file in VS Code, or use an existing TSconfig.
Official VS Code docs :
https://code.visualstudio.com/docs/languages/jsconfig
Use path mapping to avoid fumbling over long relative module imports in your JavaScript code. Just create a JSconfig.json file in VS Code, or use an existing TSconfig.
Official VS Code docs :
https://code.visualstudio.com/docs/languages/jsconfig
Some Nuxt Js Resources
1. Nuxt Js official site
https://nuxtjs.org/
2.Nuxt js Crash Course by Traversy Media
https://youtu.be/ltzlhAxJr74
3.Curated list of awesome resources : nuxtjs communities, articles, videos about using Nuxt.js
https://github.com/Developerayo/awesome-nuxtjs
4. A curated list of awesome things related to Nuxt.js
https://github.com/nuxt-community/awesome-nuxt
5.Official GitHub of nuxt Js
https://github.com/nuxt/nuxt.js
6.Universal application code structure in Nuxt.js
A brief summary of source code structure in Nuxt.js
https://medium.com/free-code-camp/universal-application-code-structure-in-nuxt-js-4cd014cc0baa
7. Master Nuxt.js - A Vuejs framework by building projects
Udemy link:
https://www.udemy.com/course/master-nuxtjs-a-vuejs-framework-by-building-projects-and-deploy/
DOWNLOAD LINK:
https://tut4dev.ir/en/product/6041/free-master-nuxt-js-a-vuejs-framework-
1. Nuxt Js official site
https://nuxtjs.org/
2.Nuxt js Crash Course by Traversy Media
https://youtu.be/ltzlhAxJr74
3.Curated list of awesome resources : nuxtjs communities, articles, videos about using Nuxt.js
https://github.com/Developerayo/awesome-nuxtjs
4. A curated list of awesome things related to Nuxt.js
https://github.com/nuxt-community/awesome-nuxt
5.Official GitHub of nuxt Js
https://github.com/nuxt/nuxt.js
6.Universal application code structure in Nuxt.js
A brief summary of source code structure in Nuxt.js
https://medium.com/free-code-camp/universal-application-code-structure-in-nuxt-js-4cd014cc0baa
7. Master Nuxt.js - A Vuejs framework by building projects
Udemy link:
https://www.udemy.com/course/master-nuxtjs-a-vuejs-framework-by-building-projects-and-deploy/
DOWNLOAD LINK:
https://tut4dev.ir/en/product/6041/free-master-nuxt-js-a-vuejs-framework-
Next Js Resources
1.Next Js tips
https://nextjstips.com/
2. NextJs official site
https://nextjs.org/learn/basics/create-nextjs-app
3. Next js tutorial for beginners Playlist by TheNetNinja
https://youtube.com/playlist?list=PL4cUxeGkcC9g9gP2onazU5-2M-AzA8eB
4. Learn Next.Js Playlist by Lee Robinson
https://youtube.com/playlist?list=PL6bwFJ82M6FXjyBTVi6WSCWin8q_g_8RR
1.Next Js tips
https://nextjstips.com/
2. NextJs official site
https://nextjs.org/learn/basics/create-nextjs-app
3. Next js tutorial for beginners Playlist by TheNetNinja
https://youtube.com/playlist?list=PL4cUxeGkcC9g9gP2onazU5-2M-AzA8eB
4. Learn Next.Js Playlist by Lee Robinson
https://youtube.com/playlist?list=PL6bwFJ82M6FXjyBTVi6WSCWin8q_g_8RR