catherinee24 / Master-in-JS-Course

Learning and making javascript master!!

What is this repository about? 🌟

I'm really training myself in the language of JavaScript, so I decided to show you guys everything I'm learning and my journey as well.

• Live Demo 💥: https://cheery-dusk-15e1d0.netlify.app/
• Local Storage Demo 💥: https://astonishing-churros-f1bd4c.netlify.app/

In this Repo the tools I used were:

1️⃣ JavaScript
2️⃣ HTML 
3️⃣ CSS

The structure of the project is as follows:

- I separated each topic into folders to be able to access the topics that interest me to review more easily.

- In each folder you will find the .js files where there will be theory and practice of each topic. You also find the files index.html and styles.css

- I left very specific comments in each code to identify everything much better and to know what each function does in the code.

- There are also small exercises where we apply everything learned.

- I'll leave some Demos at the top of this README.rd feel free to interact with them.

Purpose with which I did it: 💥

To practice topics on your own like:

VARIABLES ✅

-Variables and comments.
- strict mode
- let and var
-constants

Types of data and Operators ✅

- Operators and data types
- Detect the data type with (typeof)

Control structures -Conditional ✅

- Conditional if 
- Conditionals and logical operators 
- Conditional switch

Control Structures - Iterators and Loops ✅

- for loop
- while loop
- Do while loop
- How to stop a loop - break

Alerts and windows ✅

Alerts and windows of data entry

functions and methods ✅

- Create functions
- Parameters
- Optional parameters
- Functions within others
- Rest and Spread parameters
- Anonymous functions and callbacks
- Arrow functions
- The scope of the variables
- Methods for processing texts
- Search methods
- replacement functions
- JavaScript text template

Arrays ✅

- Basic Arrays
- Advanced Arrays
- Loop through arrays: for , forEach
- Multidimensional Arrays
- Operations with Arrays
- Convert a string to an array
- Sort arrays
- Loop through arrays: for...in
- Search in an array

DOM - Document Object Model ✅

- Introduction to the DOM
- Select and modify page elements
- Practicing with the DOM - querySelector, getElementById...
- Query Selector All

BOM - Bowser Object Model ✅

- Manipulate the browser and get data with JavaScript

Events ✅

- What is an event + mouse event
- Keyboard and focus events etc...
-Load event
- Timers

JSON Object in JS - JavaScript Object Notation ✅

- operator this
- JSON What is it and how to use the objects?

Local Storage ✅

LocalStorage in the browser

Asynchronous requests (Fetch, Ajax) and promises ✅

- Fetch and asynchronous requests
- Promises and Fetch
- How to create promises
- Catch error in promises
- Catch bugs

Dates - Math and more ✅

- Dates in JS
- Math functions in JS

Feel free to clone the repo, I'll be happy if you practice your knowledge from this source. 💯

Setup

Clone this Repo

git clone https://github.com/catherinee24/Master-in-JS-Course
cd Master-in-JS-Course

Then install dependencies

yarn

Or if you use the management package npm

npm install

A little advice for you: ❗❗❗

I usually use "Prettier" to improve my code and make it look cleaner. It is also super useful for those who are starting to program. I know that when we are beginners in writing code, we usually make mistakes or our code looks messier and we can't read it ourselves.

Prettier definition

Prettier offers support for multiple languages and frameworks. What Prettier offers is to take your code and "re-format" it based on the defined settings thus maintaining a consistent style. Making it much more readable and without worrying about how you write it initially.

Install .Prettier 🧮

[Install Prettier!!]

Contributing

Contributions are always welcome! Open a PR or an issue!

Thank you ! 👋