Skip to content

NithinSangsi/JavaScriptBasics

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

📘 JavaScript Learning by Nithin

Welcome to my JavaScript learning repository!
This repo contains several beginner to intermediate JavaScript mini-projects that I developed while learning from platforms like YouTube, W3Schools, and various online resources.

💡 This repository is a great reference for learners looking to understand JS concepts through practical examples.


🛠 Prerequisites & Setup

To run and edit the files smoothly, you should install:

✅ Install Visual Studio Code

  • Download & Install VSCode.
  • Install the following useful extensions:
    • Live Server : Auto-refreshes HTML in the browser.
    • Prettier: For consistent code formatting.
    • JavaScript (ES6) code snippets: To speed up JS coding.
💡 Alternatively, you can use IntelliJ or WebStorm with JS plugins.
  • Install IntelliJ IDEA (Community/Ultimate).
  • Install the JavaScript and HTML/CSS plugins.
  • Enable Live Edit or use the built-in web preview.

📁 Folder Structure

📦javascript/

├── index.html # HTML file containing references to different JavaScript components

├── index.js # Main JavaScript learning file (with detailed topics & examples)

├── index1.js # Calculator logic using vanilla JS

├── styles.css # CSS for styling the calculator and other components and thre dice images are in the dice images folder for the dice mini project.

🚀 How to Run

1. Clone or download this repository:

git clone https://github.com/NithinSangsi/JavaScriptBasics.git

2. Navigate to the folder:

cd javascript

3. Open the folder in Visual Studio Code:

 code .

4. Open index.html and:

 Right-click → Open with Live Server (if installed)

 //Or open it manually in your browser

5. Open Developer Tools (Ctrl + Shift + I) to view console outputs.

🧠 What's Inside (index.js)

The index.js file includes numerous JavaScript concepts and practical examples, such as:

✅ Variables, Strings, Booleans, Constants

➕ Arithmetic Operations, Type Conversion

💬 User Input Handling (Prompt, DOM input)

📄 DOM Manipulation

🔄 Conditional Statements (if, else, switch)

🔁 Loops (for, while)

📚 Arrays, Spread & Rest Operators

🧠 Math Object & String Methods

🎲 Dice Game, Password Generator, Number Guessing Game

⚙️ Functions, Callback Functions

📦 Functional Programming: map, filter, reduce

🧑‍🎓 OOP: Classes, Constructors, Inheritance, Getters/Setters

⚠️ Note to Learners: All code sections are well-commented for learning. Please remove the comments and try to write and understand the code yourself for best learning outcomes.

🎯 Learning Outcomes

By using this repository, you will:

Strengthen your JavaScript fundamentals

Practice real-world DOM manipulations

Develop logic-building skills through mini-projects

Learn functional and object-oriented programming in JS

Understand client-side browser interaction

💬 Feedback or Suggestions

Have ideas or improvements ? or any Corrections ?

Feel free to fork this repository and submit a pull request.

You can also open an issue if you find any bugs or have suggestions.

🙏 Special Thanks

Thanks to these amazing learning platforms:

W3Schools {in-depth knowledge for the basics of Js}

JavaScript YouTube Tutorials

Online articles and documentation that inspired these Mini projects

👨‍💻 Author

Meeeeeeeeeeeeeeeeeeeeeee

Frontend & JavaScript Enthusiast

About

Know the basics of JavaScript !!!!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors