10_JavaScript_Projects

Counter

Live url: https://rajiv-0920.github.io/Counter/

Key Concept Cover

1. document.getElementById("")
2. addEventListener()
3. Function
4. innerText
5. Switch

Rating Project

Live url: https://rajiv-0920.github.io/Interactive-Rating/

Key Concept Cover

1. document.getElementById("")
2. document.querySelectorAll("")
3. document.querySelector("")
4. Object
5. forEach
6. addEventListner()
7. disabled
8. src
9. innerText
10. classList
11. history.back()

Employee_Stats

Full Responsive Employee Stats website With counting animation using HTML CSS and JavaScript.

Live url: https://rajiv-0920.github.io/Employee_Stats/

Key Concept Cover

1. document.querySelectorAll("")
2. document.querySelector("")
3. addEventListner()
4. new Date()
5. Array
6. setInterval()
7. innerText
8. forEach
9. dataset
10. Math.floor()
11. switch
12. function

Countdown

Live url: https://rajiv-0920.github.io/Countdown/

Key Concept Cover

1. document.querySelector();
2. addEventListner()
3. setInterval()
4. new Date()
5. Math.floor()
6. innerText

Tip Calculator

Live url: https://rajiv-0920.github.io/Tip-calculator-app/

Key Concept Cover

1. document.getElementById("")
2. document.querySelectorAll("")
3. document.querySelector("")
4. addEventListner()
5. Function
6. classList
7. forEach
8. Array.form()
9. dataset
10. toFixed()
11. location.reload()

Rotate Image Gallery

Live url: https://rajiv-0920.github.io/Rotate-Image-Gallery/

Key Concept Cover

1. document.querySelector()
2. setInterval
3. style.transform
4. addEventListner

Random Color Generator

Live url: https://rajiv-0920.github.io/Random-Color-Generator/

Key Concept Cover

1. document.querySelector()
2. addEventListener()
3. Function
4. innerHTML
5. For loop
6. Math.floor()
7. Math.random()
8. toUpperCase();
9. String
10. forEach()
11. parentNode
12. children
13. document.querySelectorAll()
14. split()
15. filter()
16. join()
17. setTimeout()
18. Navigator
19. classList.add()
20. classList.remove()

Frontend Mentor - Coding bootcamp testimonials slider

Live Url: https://rajiv-0920.github.io/Coding-Bootcamp-Testimonials-Slider/

Key Concept Cover

1. Array
2. Object
3. getElementById()
4. addEventListener()
5. function
6. style.opacity
7. innerText

Simple Age Calculator

Live Url: https://rajiv-0920.github.io/Simple-Age-Calculator/

Key Concept Cover

1. getElementById()
2. querySelector()
3. new Date()
4. addEventListener()
5. function

Simple Quote Generator

Live Url: https://rajiv-0920.github.io/Simple-Quote-Generator/

Key Concept Cover

1. document.getElementById("")
2. document.querySelectorAll("")
3. document.querySelector("")
4. addEventListener()
5. function()
6. disabled
7. innerText
8. fetch
9. json()
10. innerHTML
11. forEach
12. click()
13. href
14. target
15. location
16. try & catch

Word Counter

Live Url: https://rajiv-0920.github.io/Word-Count

Key Concept Cover

1. getElementById()
2. addEventListener()
3. Function
4. RegEx
5. match()
6. innerText

QR Code Generator

Live Url: https://Rajiv-0920.github.io/QR-Code-Generator/

Key Concept Cover

1. getElementById()
2. querySelectorsAll()
3. querySelector()
4. addEventListener()
5. function()
6. img.src
7. innerText
8. document.body
9. forEach
10. Array.from()
11. dataset
12. switch()
13. split()
14. join()
15. map
16. filter
17. json()
18. fetch
19. innerHTML

QR Code Contents

E-mail address

    # Address
    mailto:someone@yoursite.com

    # Address, subject
    mailto:someone@yoursite.com?subject=Mail%20from%20Our%20Site

    # Address, CC, BCC, subject
    mailto:someone@yoursite.com?cc=someoneelse@theirsite.com,another@thatsite.com,me@mysite.com&bcc=lastperson@theirsite.com&subject=Big%20News

    # Address, CC, BCC, subject, body
    mailto:someone@yoursite.com?cc=someoneelse@theirsite.com,another@thatsite.com,me@mysite.com&bcc=lastperson@theirsite.com&subject=Big%20News&body=Body%20goes%20here.

Using

    MATMSG:TO:{someone@yoursite.com};SUB:{Mail%20from%20Our%20Site};BODY:{Body%20goes%20here.};;

Phone

    tel:{0000000000};

WIFI

    `WIFI:S:{wifi_name};T:{WEP|WAP|blank};P:{password};H:{true|false|blank}`

Contact

    MECARD:N:{name};ADR:{address};TEL:{number};EMAIL:{email};ORG:{company};URL:{website};;

Twitter

    https://twitter.com/{twitter_id}

Whatsapp

    https://wa.me/{number}

SMS

    SMSTO:{sms_number}:{sms_message}

Instagram

    https://www.instagram.com/{id}/

Linkedin

    {Linkedin profile link}

Website

    {URL}

Location

    http://www.google.com/maps/place/{latitude},{longitude}

Youtube

    {youtube_link}

Language Translator

Live url: https://rajiv-0920.github.io/Language-Translator/

Key Concept Cover

1. getElementById()
2. querySelector()
3. function
4. addEventListener
5. fetch
6. for in loop
7. innerHTML
8. dataset
9. setAttribute
10. navigator.clipboard.writeText()
11. new SpeechSynthesisUtterance()
12. window.speechSynthesis.getVoices()
13. window.speechSynthesis.speak()