This repository had been dormant since December 2021, but on November 5, 2023, at 4:30 AM, it was reincarnated as next-gen-mini-projects.

1. JS-HTML-CSS 📁 : Guide
2. React 📁 : Guide
3. Python 📁 : Guide

1. JS-HTML-CSS
2. React
3. Python

Simple Dark Mode Page using HTML, CSS and JS.

Glowing text animation with CSS and using gif in button background.

Fetching data from Waifu Pics Api and using pics in carousel that gives random pic animation from any of the 4 sides of carousel.

Counting the number of words, letters and emails in the given text.

Giving an option to change the image source and making custom context menu on right click. The idea of making custom context menu can be very useful at times. Some of the interesting things we can do with it is making a custom menu for video player or context menus like we see in figma, g-slides, etc.

Particle JS is a lightweight JavaScript Library that enables us to create particles on HTML canvas and do some really cool stuff with particles without actually having us to deal with canvas. Using this, many cool interactive animations can be made on hovering or clicking some field in website. If interested then you can visit this website to see what more stuff it can do - Link

Live Progress Bar which indicates the percentage of page height scrolled.

This project involves interaction with html video. I got the idea of this project while i was watching a coursera video and suddenly a quiz appeared in between the video. This kind of quiz is helpful to checkout if the learner has learned from the video till a certain point or whether the learner needs a revision. I thought this functionality is cool so i tried to implement it using vanilla js. A lot more can be done with this project but for now only the question appearance functionality is implemented.

A lot of websites show code on their platform. So for making the code look clean and attractive, syntax highlighting is necessary. In this project highlight.js is used for syntax highlighting and clipboard.js is used for copying the code to clipboard. As an example i have highlighted only three languages in the project but highlight.js offers highlighting for many other languages. Using these libraries is simple and doesn't require much time.

A pre loader for website which can be set upto our desired time. But many times, we just need a pre loader which disappears after page has loaded completely, so i have provided the code for that here but it is commented out since i have taken the desired time loader as an instance for the project.

Three.js is a powerful javascript library for animation. Many websites use it to display very attractive animations. Some people use it for making their portfolio attractive(and they often use particles.js too !), in short it is used wildly. Shaktimaan is an Indian Superhero from a TV series during late 90s - early 2000s and he has the capability to fly by spinning himself. If you have seen the live demo you might be still laughing, i was laughing too when i thought of making this and honestly it turned out to be funny. As soon as i discover some more funny things i will update this project a bit.

A responsive navbar project.

Simple illustration of useState, useEffect, useRef hooks and conditional rendering.

In this project Chart.js is used in order to build charts which represent the variation in sum of first 30 natural numbers. Here i have dynamically implemented 6 different chart types namely Line, Bar, Pie, Doughnut, Polar Area Chart and Radar Chart.

In this project two libraries are used, namely react-spinners and react-router. react Spinners is used for the preloader whereas the react Router helps us with routing.

useState Hook project - react Hooks Series.

Using Beautiful Soup library to extract info of current top billionaires such as Name, Net Worth, Residence, Stake and Assets. Link to Final Outcome File.

In this project user gets an option to either set a custom password or to get a random strong password. There is proper exception handling in the project so unusual/invalid response won't make our program crash. This project is challenging, because it is a bit lengthier to be done in an hour by following along the given code. But irrespective of the time it can take, it is a good project for practice. See the Output here

A project to make aware about pyshorteners Library. Most of the projects that belong to tea time difficulty are like this.

1. FAQ

1. What do the tags imply ?
   🖊️ The tags contain information about the library/framework/concepts/methods/tools used in the project.

2. What is there in the description ?
   🖊️ Description has more infomation about the projects. It explains the project and sometimes has some information about the essentials used in the project.

3. What decides the difficulty level of a project ?
   🖊️ The difficulty level is decided by assumptions. So it will differ for different people. The thumb rule to decide is by assuming the amount of effort it can take to make the project if it is done by someone who is beginner in working with the tools used in the project.The difficulty levels are -

• tea time - You can easily do these projects while you are having a break time, snack or tea/refreshment. These projects quickly introduces something new(i.e. never introduced here before).
• easy
• easy to moderate
• moderate
• moderate to challenging
• challenging.

4. How are the categories decided ?
   🖊️ Each programming language is separated as a category and have their own respective directories. If it seems like there will be multiple projects from some library/framework then it is also separated as a category.