JavaScript Learning Project

Overview

A comprehensive JavaScript learning project with 7 practical exercises designed to master fundamental programming concepts.

Project Structure

J_to_S/
├── index.html          # Main interface with Apple-style dark theme
├── basics.js           # Learning exercises and warmup code
├── script_1.js         # Exercise 1: Hello World
├── script_2.js         # Exercise 2: Calculator
├── script_3.js         # Exercise 3: Guessing Game
├── script_4.js         # Exercise 4: Mario Pyramid
├── script_5.js         # Exercise 5: Entrepreneurs Analysis
├── script_6.js         # Exercise 6: Librarian
├── script_7.js         # Exercise 7: Genetic Code
└── README.md           # This file

Features

• Interactive Learning: Step-by-step JavaScript fundamentals
• Modern UI: Apple-inspired dark theme with liquid effects
• 7 Practical Exercises: From basic Hello World to complex algorithms
• Feynman Technique: Learning methodology for better understanding

Getting Started

1. Open index.html in your browser
2. Select an exercise from the dropdown
3. Follow the interactive prompts
4. Check the browser console for output

Learning Path

1. Variables & Operations: let, const, arithmetic operations
2. Conditions: if/else statements and comparisons
3. Loops: for and while loops
4. Functions: Creation, parameters, and user interaction
5. Arrays: Creation, indexing, and manipulation
6. Objects: Properties and methods
7. Strings: Manipulation and methods

Exercises

• Script 1: Hello World with user input
• Script 2: Basic calculator operations
• Script 3: Number guessing game
• Script 4: Mario-style pyramid generation
• Script 5: Entrepreneur data analysis
• Script 6: Library management system
• Script 7: Genetic code processing

Technologies Used

• HTML5
• CSS3 (with animations and effects)
• JavaScript (ES6+)
• Modern browser APIs

Learning Methodology

This project follows the Feynman Technique:

1. Explain concepts in simple terms
2. Identify knowledge gaps
3. Return to sources for clarification
4. Re-explain with concrete analogies

Requirements

• Modern web browser (Chrome, Firefox, Safari, Edge)
• Basic understanding of HTML/CSS (optional)

Usage

1. Navigate to the project directory
2. Open index.html in your browser
3. Use the script selector to choose exercises
4. Follow the on-screen instructions

Contributing

This is a learning project. Feel free to experiment and modify the code to enhance your understanding.

License

Educational project - feel free to use and modify for learning purposes.