Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/muhamedayoub/javascript-dom-workshop
JavaScript DOM Workshop
https://github.com/muhamedayoub/javascript-dom-workshop
dom javascript vite
Last synced: 9 days ago
JSON representation
JavaScript DOM Workshop
- Host: GitHub
- URL: https://github.com/muhamedayoub/javascript-dom-workshop
- Owner: MuhamedAyoub
- License: mit
- Created: 2023-04-30T07:12:25.000Z (almost 2 years ago)
- Default Branch: end
- Last Pushed: 2023-05-02T08:07:02.000Z (almost 2 years ago)
- Last Synced: 2024-11-29T12:42:23.945Z (2 months ago)
- Topics: dom, javascript, vite
- Language: JavaScript
- Homepage:
- Size: 22.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# JavaScript Dom Workshop
#### Welcome to the JavaScript Workshop!
## Workshop Summary
In this workshop, you will learn how to build a Contact Manager application using JavaScript, HTML, and BOOTSTRAP. The Contact Manager allows you to store and manage contact information such as names, email addresses, and phone numbers. You'll learn important JavaScript concepts like DOM manipulation, event handling, object-oriented programming (OOP), and working with modules.
Throughout the workshop, you'll build the Contact Manager step by step, starting from a simple HTML structure and gradually adding functionality using JavaScript. The workshop will cover topics such as:
- Creating and updating contact objects using object-oriented programming (OOP) principles.
- Dynamically rendering contacts in a table using the Document Object Model (DOM).
- Implementing event handling to enable adding, updating, and deleting contacts.
- Performing search operations to filter contacts based on specific criteria.
- Learnig how write clean code.
Along with learning the core JavaScript concepts, you will also focus on writing clean and maintainable code. The workshop will emphasize best practices for code organization, readability, and following coding conventions. You'll learn techniques for structuring your code, using meaningful variable and function names, and writing comments to enhance code clarity and maintainability.
By the end of the workshop, you will have a fully functional Contact Manager application that not only demonstrates your knowledge of JavaScript concepts but also showcases your ability to write clean and well-structured code.
## Installation
To install the project dependencies, run the following command:
```bash
chmod +x linux-install-npm.sh
./inux-install-npm.sh
npm install
```
If you are using Window
``` powershell
Set-ExecutionPolicy RemoteSigned
./windows-install-npm.ps1
npm install
```
This will install the required dependencies and start the project.
Once the installation is complete, you can start the workshop by running the following command:
```bash
npm start
```
Feel free to explore and modify the code to learn more about JavaScript and DOM manipulation.
## License
This project is licensed under the [MIT License](LICENSE).