Part 1 – How to make an e-commerce website with HTML, CSS and JS
Fullstack e-commerce Series –
Fullstack Social Media website –
Part 1 – How to make an e-commerce website with HTML, CSS and JS
In this video, you’ll learn to create a fullstack e-commerce online store website. This is part 1 of e-commerce website. In this part, you’ll make 4 pages – Home page, product page, search page and 404 page.
Source Code –
Buy Me a coffee –
Support me in making these videos –
Download Images –
If you like this tutorial make sure to hit like button and show your support by subscribing my channel.
👇Subscribe My Channel👇
👇Follow me on Instagram👇
❤❤ Have a nice day ❤❤
––––––––––––––––––––––––––––––
Over You – Atch
Creative Commons — Attribution 3.0 Unported — CC BY 3.0
Free Download / Stream:
Music promoted by Audio Library
––––––––––––––––––––––––––––––
Disclaimer video is for educational purpose only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for “fair use” for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use
#ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorial
source
Did you like it ? You can find more below –
Fullstack ecom 1.0 website series – https://youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD
Ecom 2.0 with paypal payment – https://www.youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg
Fullstack Social Media Site – https://www.youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1
Sir My slider is not working. what did i do?
"
const productContainers = […document.querySelectorAll('.product-container')];
const nxtBtn = […document.querySelectorAll('.nxt-btn')];
const preBtn = […document.querySelectorAll('.pre-btn')];
productContainers.forEach((item, i) => {
let containerDimenstions = item.getBoundingClientRect();
let containerWidth = containerDimenstions.Width;
nxtBtn[i].addEventListener('click', () => {
item.scrollLeft += containerWidth;
})
preBtn[i].addEventListener('click', () => {
item.scrollLeft -= containerWidth;
})
});
// console.log('running');
"
Planning to create my own ecommerce website this will definitely help thanks
Sir I have some errors when I cut Class nav to nav.js
How can I buy your subscription?
Where is the data base
Please create mern crud full application 💐
everytime i try copying the nav bar the red line pops up and doesnt let me fiinsh
pls where is the part two (backend) of this video
Sir whenever I was writing code in innerhtml is not working
hello
i have on problem
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Times New Roman', Times, serif;
}
.navbar{
position: sticky;
top: 10;
left: 110;
width: 100%;
height: 100px;
background: #f5f5f5;
z-index: 9 ;
}
.nav {
padding: 10px 10vw;
display: flex;
justify-content: space-between;
}
.brand-logo{
height: 60px;
}
.nav-items{
display: flex ;
align-items: center;
}
erro
px dont red
When I posted my nabar html to the java script file I had to remove all carriage returns, otherwise it gave errors at the end of each line.
34:49 doesn't scroll what should I do??
Is this mobile responsive?
Watch – Working Women — https://www.youtube.com/watch?v=79_rgjF_K6s t
Watch – Working Women — https://www.youtube.com/watch?v=79_rgjF_K6s
I give this a 5⭐ rating, I have to share your YouTube video to boost your number of subscribers, kindly accept this as my own support. Am a full stack developer willing to learn more
Hello sir g ..my 2nd producr file not creat nave bar .because nav.js and footer.js is not working ..why? Plz help mee
is this website will going to be responsive?
Where can I download those images ? thanks
The image output is not work ?
Hello Modern Web ! Thankyou for uploading such great tutorials. I was looking this kind of stuff cause I am depressed of learning theory (HTML/CSS/JAVASCRIPT).But still i have some queries about how @import 'nav.css' —— and the arrow function u used …. work . Can u make some practical real world pure javascript tutorials focusing just on front end web development with elaborating concepts. I'm just a beginner and not a computer science degree person. It is just my query or request, never mind if done something wrong. Thanks in Advance.
Great tutorial, this helped a lot!
The best… thank you!
But will this be a responsive one? Because as far I know using pixel the web can't react with any sized display
Why you used display: block; and margin: auto; in 19:25? It works for me even without those styles
Can i use the site i made by looking at you dude
Very Helpful for learning purpose.
I got many new ideas and tricks from the project.
It will be very helpful if you make video on how to make this website responsive.
I’m struggling to put the styling of the index page in JavaScript 🫡
Chapters would be nice.
Please help i'm having proplems with the proudcts page. Where can i contact you?
I am creating a html, css, php website using this tutorial. How do i make my website interactive using php instead of js?
what about search bat
Will it work on mobile (the website)
Я никогда не сомневался в том, что в иностранном комьюнити есть крутые туториалы.
I don't like the video because codes are wrong
I dont know all of these properties could you tell me abt this properties
52:00
and also my search bar keeps placing below my logo. please help
what do you do to line 19 at 1:18:06 to make line 19 two lines before line 20
This is an extremely helpful tutorial! Thank you! Are there any difference between the usage of :
const doSomething = () => {
…
}
and
function doSomething() {
…
}
Does it matter any thing ?
A rather silly question. Which browser does this guy use to run this stuff? I'm new into HTML,CSS and JS and I'm having trouble running these files. Chrome and EDGE aren't running my code by using the run command. Who's there please?
Hii !! there is scroll bar after writing the price please give any solution how to overcome from this?
At 30:08 images are overlaping instead of being separeted. I reviewed the code multiple times but cant seem to find the error.
Where do you think the problem is in the code?
Sir, Can you turtorial about login and register page?
what's the use of ?
Need help in doing payment don't have credit cart