How to make simple card hover effect in 2022. Create stunning card hover effects with ease! Modern Web 2022-03-12 | This is for beginners, learn to create simple but amazing card hover effect using only CSS in 2022. Very east to understand explanation with source code. In this video youβll learn to this hover effect along with some other things as well. You learn how to blur background image, how to centre an element, how to get hover effect and a lot of stuffs. If you loved the video donβt forget to share it with your colleagues Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Dsicord - discord.gg/HEvbucgT Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comπ Fullstack ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Fullstack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/63700019 π Download image - drive.google.com/file/d/17MqERjr7sO4F6bVQ3HGvc205_INnQGMM/view?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The subtle art of not giving a f*ck [US] - amzn.to/31iY4wm The subtle art of not giving a f*ck [IN] - amzn.to/32ODgNy -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k If you like this tutorial make sure to hit like button and show your support by subscribing my channel.β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β hover effect,card hover effect,adobe xd hover effect,css hover effects,button hover effect,css card hover effects,adobe xd hover effect design & prototype tutorial,css image hover effect,card hover,top css hover effects,xd hover,elementor hover effects,button hover,elementor card hover effects,adobe xd hover tutorial,css hover effects tutorial,hover effect on image,button hover effects,css card hover effects tutorial,hover effectsββ Thanks For Watching ββ
[ Part 6 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2024-01-16 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.π Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Download Updated Image Folder & editor-theme.css filedrive.google.com/drive/folders/1SxeTA2LTEZ9ZannZIZFY0B6wMq4ki0An?usp=sharingπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro01:06 - Section 1 - Notification Alert26:17 - Section 2 - Notification Page02:48:34 - Section 3 - Blog Management Page04:58:34 - Section 4 - "InPageNavigation" UI Fix05:08:28 - Section 5 - Dark Theme05:53:01 - Section 6 - "Only Admins can write" feature06:12:59 - Section 7 - Hosting Websiteββ-Thanks for watching ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
[ Part 5 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2023-12-15 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.π Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro00:35 - Section 1 - Load more replies23:46 - Section 2 - "settings" route27:41 - Section 3 - Side Navbar01:09:22 - Section 4 - Change password form01:56:35 - Section 5 - Edit Profile Page03:36:00 - Outroββ-Thanks for watching ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
[ Part 4 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2023-11-16 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.Watch Previous Part of this series from the playlist below ππ Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro03:02 - Section 1 - Blog Page Route07:05 - Section 2 - "get-blogs" route - server.js20:58 - Section 3 - Fetching Blog Details29:39 - Section 4 - Blog Page42:31 - Section 5 - "BlogInteraction" Component01:00:40: - Section 6 - Blog Page - Similar Blogs01:17:19 - Section 7 - Blog Page rendering content01:36:54 - Section 8 - Edit Blog02:02:52 - Section 9 - Like Blog02:48:33 - Section 10 - Comments - Comments Wrapper03:17:11 - Section 11 - Comments - Creating Comments in DB03:53:48 - Section 12 - Comments - Fetching Comments04:10:47 - Section 13 - Comments - Creating Comments cards04:27:40 - Section 14 - Comments - Comments Pagination04:37:15 - Section 15 - Comments - Replying to comments05:06:05 - Section 16 - Comments - Hiding & Loading Replies05:34:28 - Section 17 - Comments - Deleting Comments & replies06:08:27 - Outroββ-Thanks for watching ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
[ Part 3 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2023-11-06 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.Watch Previous Part of this series from the playlist below ππ Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro02:12 - Section 1 - Setting Up Home route04:54 - Section 2 - Home Page08:50 - Section 3 - Home Page - "InPageNavigation"37:01 - Section 4 - Home Page - "latest blogs" route47:48 - Section 5 - Home Page - fetching latest blogs56:08 - Section 6 - Home Page - Blog Card01:23:24 - Section 7 - Home Page - "trending blogs" route01:28:51 - Section 8.1 - Home Page - fetching trending blogs01:31:14 - Section 8.2 - Home Page - Minimal Blog Card01:40:22 - Section 9 - Home Page - Filters + Trending Blogs 02:01:10 - Section 10 - Home Page - Filter blogs by categories02:10:35 - Section 11 - "NoDataMessage" Component02:16:45 - Section 12 - Pagination03:04:54 - Section 13 - Working Search Input03:09:25 - Section 14 - Search Route03:12:33 - Section 15 - Search Page03:33:35 - Section 16 - Searching User03:40:15 - Section 17 - Search - User Card 03:56:00 - Section 18 - 404 Page04:06:46 - Section 19 - User Route04:09:09 - Section 20 - User Profile Page04:44:34 - Section 21 - User Profile Page - "About User"05:05:22 - Section 22 - User Profile Page - Rendering Blogsββ-Thanks for watching ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
[ Part 2 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2023-10-30 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπ AWS Cors TXT File - drive.google.com/file/d/1Ft-wA2VMuvMBESsmflL4BWH_wWkh_lRg/view?usp=sharing πDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.Watch Previous Part of this series from the playlist below ππ Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro01:18 - Section 1 - Setting Up "/editor" route04:42 - Section 2 - Editor Page Component12:57 - Section 3 - Blog Editor - Navbar20:16 - Section 4 - Blog Editor - Banner31:04 - Section 5 - AWS S3 Bucket Setup41:34 - Section 6 - Connecting AWS to Server50:51 - Section 7 - Server Get Upload URL01:01:55 - Section 8 - Uploading Banner Image01:20:50 - Section 9 - Blog Title Texture01:35:06 - Section 10 - Editor Context01:53:03 - Section 11 - Blog Editor02:22:36 - Section 12 - Text Editor Context & Changing Editor State02:38:18 - Section 13 - Publish Form03:48:35 - Section 14 - "Create-blog" route04:38:20 - Section 15 - Publishing the blog04:56:42 - Section 16 - Saving Blog Draft05:08:58 - Outro ( Thanks for watching )ββ-Thanks for watching ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
[ Part 1 ] - Code MERN Blogging website | Fully Working Blog Editor ( MongoDB, ReactJS, Nodejs ) Modern Web 2023-10-02 | Build MERN Stack Blogging website that will shine in your portfolio, from having a fully modern editor to a working notification system and comments system, It has all. It has not only a modern design and responsive layout but also has tons of features that you won't find on any other video on YouTube. If you are beginner or a pro, feel free to watch this fully detailed tutorial covering eveything from scratch, you just need a basic understanding of React and that sit to start working on this project. This uses mongoDb as a database, nodejs for its server side coding and react js for its frontend. You will learn a lot of stuff while making this project.....πFiles to start ( Github Link ) - github.com/kunaal438/mern-blogging-websiteπDownload Source Code ( Use 1 of the 3 options below )Patreon - patreon.com/posts/fullstack-mern-90122909Buymeacoffee - buymeacoffee.com/modernweb/e/171824Or Become my channelβs member to get the source code.πΒ Playlist link - youtube.com/playlist?list=PLqm86YkewF6QbR7QwqYWcAbl70Zhv0JUEπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram - instagram.com/themodernwebTwitter - twitter.com/modernweb438Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβ°Time Stampsβ°ββββββββββ-00:00 - Intro19:10 - Section 0 - Download Github Repo24:03 - Section 1 - Navbar54:46 - Section 2 - Setting Up Routes01:02:08 - Section 3 - User Auth. Form ( UI )01:37:48 - Section 4 - Page Animation01:48:12 - Section 5 - Server Setup + User Auth. Form Routes02:57:38 - Section 6 - Connecting Form UI to server03:29:52 - Section 7 - Store user in sessions03:42:02 - Section 8 - User Navigation + Sign Out04:11:43 - Section 9 - Google Authentication04:52:12 - Outroββ-Thanks for watchingΒ ββ-ββββββ π Tags ββββββ#MongoDatabaseBlog #MERNStackBlogspot #MERNBlogging #WebsiteDevelopment #FullStackBlogging #ReactJSBlogs #CodingLife #MongoDBBlog #ProgrammingBlogs #TechBlogging #webdesign #developerdiaries #websites #codingcommunity #fullstack #how #makewebsite #codinglife #websiteforblogging #howtomakewebsite #howtomakebloggingweb #BlogsWithReact #FullStackCreator #CodingInspiration #MERNStackBlogs #CodingInReact #MongoDBBloggers #ReactBlogging #CodingCommunity #FullStackDevBlog #BloggingInMERN #MERNStackPost #ReactJSLife #TechBloggersUnite #BuildingWithReact #BloggersOnMERN #MERNDevLife #BackendBlogging #ProgrammersBlog #TechSpaceBlogs #FullStackJourney#MongoDatabaseBlog #MERNStackBlogspot #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
Build a responsive Food Order website with HTML, CSS and JS | Food Order Landing Page Modern Web 2023-07-10 | If you know HTML, CSS but still find making websites difficult. This video will teach you step by step to apply your knowledge to not only make a website from figma design file but also make that responsive using CSS media query. Not only that but in the website you will find small CSS animations on scroll as well which we will achieve by using a library called βanimate on scrollβ. There is so much to learn in this video and to practice your web development skills. Letβs code then.πFiles to start ( Github Link ) - github.com/kunaal438/food-order-landing-page-html-css-js πFigma File Link - figma.com/file/lqsKkX683Tv7kJo9N2O3ZG/Food-Order-Landing-Page?type=design&node-id=0%3A1&mode=design&t=Vyto5sXDTiyLg6ho-1πDownload Source CodePatreon - patreon.com/modernweb/shop/responsive-food-order-landing-page-45207Buymeacoffee - buymeacoffee.com/Modernweb/e/149767 ** Use one of the two links above to get the source code **π Social Links Of Not So Social PersonββββββββββββββββββββββInstagram ( Still figuring out how to use it ) - instagram.com/themodernwebFacebook ( Mark knows everthing ) - facebook.com/themodernweb Twitter ( Never been on trending ) - twitter.com/modernweb438 Dev.to ( Yes I write too. Sometimes ) - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comπ Videos you might be interested onββββββββββββββββββββββResponsive Digital Marketing Website - youtu.be/Y636LRWBdo8Responsive Travel Website - youtu.be/j3xI8aHwZnE3D personal Portfolio - youtu.be/pOnZKrdssW4Personal Portfolio - youtu.be/gJfEwPWoh4gUnsplash Clone ( Unsplash API ) - youtu.be/LoWBkkmgRBEFullstack Ecommercer Website with payment - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTgMusic Player using JS - youtube.com/playlist?list=PLqm86YkewF6TVqRTlIowvZfh-4CD5XeL1Fullstack Blogging Website - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VWCSS Card Hovers - youtube.com/playlist?list=PLqm86YkewF6QyPdz7ObAYxtw8FAJ9Ac4L β°Time Stampsβ°ββββββββββ-00:00 - Intro01:00 - Github Repo - Download Starter Files01:47 - Navbar20:17 - Hero section49:35 - Restaurants Section01:28:07 - About Us section01:58:20 - FAQ Section02:12:38 - Download app section02:38:30 - Footer02:54:50 - Making Website responsive - Media Query03:33:00 - Adding Animations - AOS Library03:48:48 - Outroβββββ Thanks for watching βββββββββββ π Tags ββββββ#webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
How to filter an array. Learn JS. Array Filter Method for beginners #shorts #js #javascript Modern Web 2023-06-24 | #webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign #shorts #shortvideo #shortπ Social Links Of Not So Social PersonββββββββββββββββββββββInstagram ( Still figuring out how to use it ) - instagram.com/themodernwebFacebook ( Mark knows everything ) - facebook.com/themodernweb Twitter ( Never been on trending ) - twitter.com/modernweb438 Dev.to ( Yes I write too. Sometimes ) - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comβββββ Thanks for watching βββββ
Password Validation Check in HTML CSS & JavaScript | Password Strength Check in JavaScript Modern Web 2023-06-19 | In this video, you will learn how to check password validation in HTML, CSS, and JavaScript. By using this password validation checker, you can easily enter your desired password and check if it meets the necessary requirements for a strong password or not.πDownload Source CodePatreon - patreon.com/posts/84789976Buymeacoffee - buymeacoffee.com/Modernweb/e/144789** Use one of the two links above to get the source code **π Social Links Of Not So Social PersonββββββββββββββββββββββInstagram ( Still figuring out how to use it ) - instagram.com/themodernwebFacebook ( Mark knows everthing ) - facebook.com/themodernweb Twitter ( Never been on trending ) - twitter.com/modernweb438 Dev.to ( Yes I write too. Sometimes ) - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comMy name is Kunaal and I am from India. Modern Web is a channel where you can find tutorials related to HTML, CSS, JS, React and much more, In short if you master web development. You know wha channel to follow π. On this channel you will find a lot of stuffs from some crazy CSS effects to some actual practical fullstack projects. ( Checkout the channel to exlpore ). But want to learn more in different platforms as well. Then follow me on my social media where I post ( whenever I get something useful ) web dev content and video updates too.Donβt forget to like, share and subcribe πβ°Time Stampsβ°ββββββββββ-13:44 - Javascriptβββββ Thanks for watching βββββββββββ π Tags ββββββ#webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
Make a responsive one page website using HTML, CSS and JS [ With animations on scroll ] Modern Web 2023-06-17 | If you know HTML, CSS but still find making websites difficult. This video will teach you step by step to apply your knowledge to not only make a website from Figma design file but also make that responsive using CSS media query. Not only that but in the website you will find small CSS animations as well on scroll which we will achieve by using a library called βanimate on scrollβ. There is so much to learn in this video and to practice your web development skills. Letβs code then.πFiles to start ( Github Link ) - github.com/kunaal438/digital-marketing-landing-page πFigma File - figma.com/file/lHH5I39GBCfBAgkY6VuhDe/Digital-Marketing-website?type=design&node-id=0%3A1&mode=design&t=UJueoQajIZCKjsXM-1πDownload Source CodePatreon - patreon.com/posts/84706921 Buymeacoffee - buymeacoffee.com/Modernweb/e/144356 ** Use one of the two links above to get the source code **π Social Links Of Not So Social PersonββββββββββββββββββββββInstagram ( Still figuring out how to use it ) - instagram.com/themodernwebFacebook ( Mark knows everything ) - facebook.com/themodernweb Twitter ( Never been on trending ) - twitter.com/modernweb438 Dev.to ( Yes I write too. Sometimes ) - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Email - business.modernweb@gmail.comMy name is Kunaal and I am from India. Modern Web is a channel where you can find tutorials related to HTML, CSS, JS, React and much more, In short if you master web development. You know wha channel to follow π. On this channel you will find a lot of stuffs from some crazy CSS effects to some actual practical Fullstack projects. ( Checkout the channel to explore ). But want to learn more in different platforms as well. Then follow me on my social media where I post ( whenever I get something useful ) web dev content and video updates too.Donβt forget to like, share and subscribe πβ°Time Stampsβ°ββββββββββ-00:00 - Intro01:05 - Download Starter Files01:46 - Hero Section34:54 - Brands Section39:07 - About Us Section55:27 - Services Section01:05:13 - FAQ Section01:17:40 - Contact Section01:33:24 - Footer01:43:23 - Making it Responsive02:23:30 - Creating Animation02:31:00 - Outro βββββ Thanks for watching βββββπ Credit πβββββββ Icons used in the video are from Flaticon.Images used in making of this project are provided by freepik.Like Video Template provided by Ashish 2808 from Pixabay.ββββββ π Tags ββββββ#webdevelopment #responsivelandingpages #responsivewebdesign #htmltutorial #websitedevelopment #landingpage #css3 #website #codinglife #codingtutorials #react #cssanimations #mediaquery #js #javascript #learnwebdevelopment #coding #developer #websitedesign
Build and Deploy Three JS Personal Portfolio | Responsive Website under 2 Hour Modern Web 2023-03-22 | Create a personal portfolio with impeccable ease using this magical tool. With its help, you can create professional-grade websites in no time. I'm gonna show you how to make a nice showcase website. We will use three.js to add awesome effects.πFiles to start ( Github Link ) - github.com/kunaal438/threejs-personal-portfolio πDownload Source Code - patreon.com/posts/how-make-with-js-80377375 π Social Links βββββββββInstagram - instagram.com/themodernwebFacebook - facebook.com/themodernweb Twitter - twitter.com/modernweb438 Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Mail - business.modernweb@gmail.comThis is modern web, I am Kunaal content on web development, So if you want to master web development make sure to subscribe to the channel.β°Time Stampsβ°00:00:00 - Demo00:01:50 - Download Github Repo00:02:00 - Download Source Code00:02:05 - Sketchfab ( 3d Model Website )00:02:40 - Live Server Installation00:03:04 - Navbar00:07:33 - Hero Section00:11:20 - Three JS - Hero Section00:23:46 - Preoject Section00:28:38 - Filters UI - Project Section00:31:50 - Project Gallery - Project Section00:37:11 - Creating Project Cards with JS - Project Section00:43:45 - Project Filters - Project Section00:49:05 - Project Info - Project Section01:12:37 - About Section01:21:52 - Skills - About Section01:30:01 - Education & Experiences - About Section01:36:40 - Contact Section01:49:00 - Making it responsive01:49:48 - media query for screen width less than 1200px01:52:56 - media query for screen width less than 992px01:59:30 - media query for screen width less than 735px02:09:55 - media query for screen width less than 500px02:12:28 - Deploying on Netlify02:13:54 - ( Project Done ) Thanks for watchThanks for watching -----------#threejs #websitedevelopment #webdevelopment #html5 #javascript #js #css3 #htmlcss #webdev #responsivewebsite #websitetutorial #threejstutorial #3js #three ---------- π Tags ---------personal portfolio,three js portfolio,build and deploy the perfect portfolio,portfolio website,react js personal portfolio website tutorial,portfolio website using three js,personal portfolio website,how to build a portfolio,portfolio,react portfolio website build and deploy,three js tutorial,three js,complete responsive personal portfolio website,build a portfolio website with react,build a mind blowing 3d portfolio website,how to build a portfolio website, portfolio website using three js,three.js portfolio website,3d website,three js portfolio,why javascript is used in websites,three js,three js website,three js tutorial,three js website tutorial,three js portfolio website,portfolio website,build a mind blowing 3d portfolio website,3d portfolio website tutorial,how to make 3d portfolio website,3d portfolio website,portfolio website using three,portfolio,three js website portfolio,react three fiber, portfolio website with three js, portfolio website using three js, portfolio website three.js, build website with three js, personal website three js, three js web portfolio, how to make a 3d portfolio website, build a 3d portfolio website, 3d artist portfolio website, 3d website portfolio, portfolio with three.js, three js personal portfolio
Todo List Checkbox Effect | How to make a custom checkbox in CSS #shorts Modern Web 2023-03-18 | In this short, you will learn to make the to do done effect by making a custom checkbox and using CSS selectors to achieve this effect. #css #webdev #html5 #webdevelopment
Responsive Travel website using HTML CSS JS | One Page Modern Website Modern Web 2023-03-16 | Responsive Travel website using HTML CSS JS | One Page Modern WebsiteLearn to make a complete single page website from full scratch. In this video youβll learn to create modern looking website along with a cool looking tile animated image slider, Smooth scrolling, Animations on scroll and its a mobile responsive too. Youβll will learn to use google fonts, fontawesome, AOS library to crease animations on scroll.πFiles to start ( Github Link ) - github.com/kunaal438/travel-one-page-websiteπDownload Source Code - patreon.com/posts/responsive-using-80058174π Font Awesome Icons Class names in Order1. class="fa-solid fa-earth-americas card-icon"2. class="fa-solid fa-coins card-icon"3. class="fa-solid fa-book-open card-icon"4. class="fa-solid fa-person-snowboarding card-icon"give these classes to "i" tag.π Social Links βββββββββInstagram - instagram.com/themodernwebFacebook - facebook.com/themodernweb Twitter - twitter.com/modernweb438 Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Mail - business.modernweb@gmail.comThis is modern web, I am Kunaal content on web development, So if you want to master web development make sure to subscribe to the channel.β°Time Stampsβ°00:00:00 - Intro00:01:26 - Github Repo00:01:36 - Source Code00:01:47 - Navbar00:06:51 - Hero Section00:10:25 - Background Image Slider - Hero Section00:25:14 - Explore Section00:40:21 - Services Section00:55:55 - Book Now Section01:04:45 - Footer Section01:08:48 - Tab View ( Media Query )01:12:40 - Smaller Devices ( Media Query )Thanks for watching --------------------- π Tags ---------how to design a complete responsive travel website,complete responsive travel landing page website design using html css,travel website,responsive website,how to make website using html and css,complete responsive website using html css,responsive website design,responsive website using html and css,responsive travel website,website,complete responsive website from scratch using html css,travel website html css,how to build a complete responsive website from scratch,one page website,single page website,how to make a one page website,one page website wordpress,single page website tutorial,website design,one page website design,onepage website,how to create a one page website,single page wordpress website,onepage website design,website tutorial,one page website tutorial,how to create a single page website,how to make a one page website in wordpress,create a one page website,how to create one page website in wordpresscss,html css,js,html css js projects for beginners,html css js projects,css tutorial,html css js,html css javascript project,html css javascript,ΡΡΠΎΠΊΠΈ html css js,html and css,html css javascript projects,travel website html css js,html css js website projects,ecommerce website html css js,html css javascript website tutorial,css project,css sinhala,html css javascript projects for resume,html css javascript projects for beginners
Make a responsive personal portoflio with HTML, CSS and JS [ With source code ] Modern Web 2022-09-04 | Responsive Personal Portfolio Website Using HTML CSS And JavaScriptLearn to code the fully responsive modern looking personal portfolio with HTML, CSS and JS only. It's so easy to code and has a lot of fun features. You'll definitely don't wanna miss this out.Update - at 1:03:21 instead of "e.path[0]" in the condition type "e.target" to make it work.Some of its features areβ Modern Lookingβ Responsive to all screensβ TimeLine layout in about sectionβ Interactive Project section with awesome popupβ Smooth Scrolling and custom selection in websiteπDownload Image and Project.js - drive.google.com/drive/folders/1u2Nid6SBLthtmOXvbh7R7aPkqPB_iFQj?usp=sharingπDownload Source Code -Patreon - patreon.com/posts/71500707 Buymeacoffee - buymeacoffee.com/Modernweb/e/146369** Use one of the two links above to get the source code **π Social LinksInstagram - instagram.com/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1This is modern web, I am Kunaal content on web development, So if you want to master web development make sure to subscribe to the channel.β°Time Stampsβ°00:00 - Intro00:31 - Website Demo03:30 - Folder Structure04:43 - Navbar12:01 - Header Section20:21 - About section29:08 - Skills section32:10 - Time line40:58 - Project Section1:10:05 - Contact Section1:14:50 - CSS media query1:32:39 - OutroAll the materials used in the video are either created by me or I have the license to use it. If you think content used in the video your's make sure to contact me on business.modernweb@gmail.com to discuss it before giving the strike. Thanks for watching --------------------- π Tags ---------#website #webdevelopment #js #javascript #codinglife portfolio website,portfolio website html css,personal portfolio website,how to make a website,how to build a website,portfolio website html css javascript,portfolio website design in html css,responsive portfolio website,create a portfolio website,responsive portfolio website html css javascript,responsive personal portfolio website,how to create website,website layout,create website from scratch html css,how to make a portfolio website,javascript,javascript tutorial,javascript for beginners,learn javascript,javascript tutorial for beginners,javascript course,javascript basics,javascript tutorials,javascript 2020,tutorial javascript,javascript full course,javascript crash course,learn javascript for beginners,javascript beginners,javascript desde cero,kurs javascript, javascript,javascript curso,curso javascript,corso javascript,javascript lesson,curso de javascript,web development,learn web development,web development tutorial,website development,web development tutorial for beginners,web development course,web development roadmap 2020,website design,website,web development 2021,web development 2020,how to build a website,how to create a website,full stack web development course,website development atlanta,website development tutorial,development,web development in telugu,website design and development process
Stripe Payment - Fully working online store website [With Source Code] Modern Web 2022-04-01 | Stripe Code - drive.google.com/file/d/1hONyBfURU_zzp-8f-evNSCKUonJ5G1Q2/view?usp=sharing(If anyone get error while process payment use the above code)Stripe Payment - Fully working online store website, This has home page, seller page, login/signup page, product page, search page, cart page, 404 page, payment page, checkout page and a lot of stuffs. User can login or logout from the site, he/she can add a product reviews. User can also search for product and apply for seller dashboard. Sellers then can add products to the site using add product page, and edit them later, save them as a draft and a lot of other cool stuffs.π Fullstack ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Dsicord - discord.gg/HEvbucgT Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comπ Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/64572469π Download image - drive.google.com/drive/folders/1_nfvD2UTLPXMkoO07kY-0HRSeYQzsmm9?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh If you like this tutorial make sure to hit like button and show your support by subscribing my channel.β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β stripe payment,stripe,stripe payments,stripe payment tutorial,accept payments online,stripe payment links,stripe payment gateway,payments with stripe,stripe tutorial,accept payments with stripe,how to accept credit card payments online,payment gateway,online payment processing,online payment,stripe integration with online store,stripe checkout,payment systems for an online store,the best payment systems for an online store,ecommerce website,mern stack ecommerce website,how to make ecommerce website,ecommerce website design,create ecommerce website,ecommerce,how to build an ecommerce website,build ecommerce website,ecommerce website html css,full-stack e-commerce website github,ecommerce website javascript,e commerce react website,html and css ecommerce website design,ecommerce website html css javascript,ecommerce website mern stack,ecommerce website react,websiteββ Thanks For Watching ββ
Part 4 - How to make an e-commerce website with HTML, CSS and JS Modern Web 2022-03-15 | Part 4 - How to make an e-commerce website with HTML, CSS and JSIn this 4th part weβll create rating system and store userβs review to our firebase along with that we will also make cart page and do make dynamic cart product cards. π Part 1, 2 & 3 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Fullstack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comπ Support me in making these videos - paypal.com/paypalme/modernweb617 π Source Code - patreon.com/posts/63799233 π Buy me a coffee - buymeacoffee.com/Modernweb π Download images - drive.google.com/drive/folders/1AmOczUtJ90B2dZHk-Wn7uTsqC1QvnYEX?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The subtle art of not giving a f*ck [US] - amzn.to/31iY4wm The subtle art of not giving a f*ck [IN] - amzn.to/32ODgNy -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β°Timestampβ°00:00 - Intro00:16 - Demo03:52 - Review35:44 - Cart PageIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β #ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorialββ Thanks For Watching ββ
Part 3 - How to make an e-commerce website with HTML, CSS and JS Modern Web 2022-03-10 | Part 3 - How to make an e-commerce website with HTML, CSS and JSIf you want to make fully working e-commerce website this is it. This is the 3 part of full stack e-commerce website with HTML, CSS and JS. In this 3 part, weβll learn to create the add product page, dashboard and dynamic product pages along with working search page. weβll learn to add, edit and delete products to and from firebase. We do a lot of CSS stylings and JS. This video is going to be so much fun. So make sure to share this with your friends.π Full stack ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Full stack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/63613846π Download images - drive.google.com/drive/folders/1PMIONIuzS6AHWdI5Gce5prBYnMfdRkwo?usp=sharing- Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS animation that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β°Timestampβ°00:00 - Intro00:16 - Demo04:00 - Add product page28:37 - AWS S3 Setup01:04:08 - Dashboard01:39:22 - Product Page01:56:31 - Search pageIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β π΅ Music Attribution π§ βTrack: Lost Sky - Fearless pt.II (feat. Chris Linton) [NCS Release]Music provided by NoCopyrightSounds.Watch: youtu.be/S19UcWdOA-IFree Download / Stream: http://ncs.io/Fearless2YOβ Tags π β #ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorialββ Thanks For Watching β€οΈ ββ
Part 2 - How to make an e-commerce website with HTML, CSS and JS Modern Web 2022-01-24 | Part 2 - How to make an e-commerce website with HTML, CSS and JSIf you want to make fully working ecommerce website this is it. This is a second part of fullstack ecommerce website with HTML, CSS and JS. In this second part, weβll learn to create the signup page, login page, seller page and dashboard page. weβll create our own local server using express.js and also weβll perform validatins and store our user in the firsbase database. Thatβs a lot weβll cover in todayβs video. Make sure to share this with your friends.π Fullstack ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Fullstack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/61574565 π Download images - drive.google.com/drive/folders/1SbCCqSWY7JHyQIHVlj0jwFL5OMLQz4ds?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS animation that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β°Timestampβ°00:00 - Intro00:16 - Demo05:04 - Server11:39 - Sign up 58:10 - Login 1:06:48 - Logout1:17:19 - Seller1:38:26 - DashboardIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comMusic Credit - Music: Tobu - Hopehttp://youtube.com/tobuofficialReleased by NCS youtube.com/NoCopyrightSoundsβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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 favour of fair use,β Tags π β ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorialββ Thanks For Watching ββ
Home to make fully working social media website | Make working instagram clone [With Source Code] Modern Web 2022-01-16 | If you want to make fully working social media website, this video is for you. Learn to create a working instagram clone from scratch using HTML, CSS and JS. Youβll learn to create dynamic posts and add like, comment interaction to the post, youβll make user login/logout with firebase and nodejs. Youβll make a lot of backend stuffs. This video is first part of this series, In this video, youβll learn to create home page, post page and user page ONLY frontend. But in upcoming videos youβll learn to make its backend also.π Fullstack ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg π Fullstack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1 π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/61229907 π Download images - drive.google.com/drive/folders/11fFuFyFcPxjqHz-FSKm8N5Yl3tMCmSYr?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7You can support me by shoping from below link ππAmazon [ US ] - amazon.com/?&_encoding=UTF8&tag=modernwebtuto-20&linkCode=ur2&linkId=41a99f5e405e8f8fe8efd87d9a6093c5&camp=1789&creative=9325 Amazon [ IN ] - https://www.amazon.in/?&_encoding=UTF8&tag=modernwebtuto-21&linkCode=ur2&linkId=eae135c4f99fe3665283aedf842e8ed1&camp=3638&creative=24630 π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The subtle art of not giving a f*ck [US] - amzn.to/31iY4wm The subtle art of not giving a f*ck [IN] - amzn.to/32ODgNy -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β°Timestampβ°00:00 - Intro00:16 - Demo04:20 - Home Page1:11:43 - Post page1:21:52 - User pageIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β instagram clone,social media app,create a social media website,how to make a social media website with wordpress,how to make your own social media website,how to make a social media website,instagram,instagram clone app,instagram clone react native,how to make a website,how to clone instagram website using html css,how to make money with social media,how to a create social media website,how to make an online course website with wordpress, node js,social media app,node,node js tutorial,react social media website,create a social media website,nodejs,react js,how to create a social media website,node js express website tutorial,website using node js in hindi,react with node js,ββ Thanks For Watching ββ
Part 1 - HOW TO MAKE AN E-COMMERCE WEBSITE WITH HTML, CSS and js :) Modern Web 2022-01-08 | π Full Stack Ecom website 2.0 - youtube.com/playlist?list=PLqm86YkewF6THruxeooR92-8atX_oAPTg Part 1 - How to make an e-commerce website with HTML, CSS and JSIn this video, you'll learn to create a Full Stack 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.π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Source Code - patreon.com/posts/60888678 π Download images - drive.google.com/drive/folders/1zBXH3N3Nj11ZVXTn8XOKLWtHdzL2fY0P?usp=sharing - Make Full stack Ecom Website 1.0π - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS animation that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β°Timestampβ°00:00 - Intro00:16 - Demo05:43 - Folder structure06:06 - Home page50:35 - Search Page55:26 - 404 Page1:00:02 - Product page1:21:15 - Wrap upIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β #ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorialββ Thanks For Watching ββ
Learn CSS - CSS Transform | Learn CSS transform in 10 minutes [with 3 Designs for practice ] Modern Web 2022-01-06 | If you struggle with CSS transform or donβt know what it is. This video is for you. In this video youβll not only learn what is CSS transform and how to use it. But you even see its properties and learn how you can make 3d objects. The video is very simple covering the topic for you. And at the end of the video you get 3 designs which are very amazing to make. I bet if you make those 3 design, youβll not feel you donβt know about transform anymore. Interesting ? Great. Make sure you watch the video, and ask you doubt in comments. If you stuck anywhere feel free to contact me via my mail.π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb πDesign 01 - drive.google.com/file/d/1ujRNHdi2y6ET9VUXJyA0hB9C0jm7FSrE/view?usp=sharingπDesign 02 - drive.google.com/file/d/195MMd9f5xkr4pdmDbpDT4JOUIQ4uzGGz/view?usp=sharing πDesign 03 - drive.google.com/file/d/1fh3Dq7EsTEXijHzYSVCsTP5X8ferolhN/view?usp=sharing Feel Free to ask me if you stuck anywhere, and donβt forget to submit your website by tagging me on my insta @modern_web_channel - Make Full stack Ecom Websiteπ - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The subtle art of not giving a f*ck [US] - amzn.to/31iY4wm The subtle art of not giving a f*ck [IN] - amzn.to/32ODgNy -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β° Timestamps β° ββββββββββββ00:00 - Intro00:16 - About Modern Web00:48 - CSS transform01:38 - CSS translate05:10 - CSS rotate07:18 - CSS scale08:27 - CSS skew09:24 - Transform Origin10:50 - Perspective12:23 - Wrap upIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β css transform,css transform translate,learn advance css transform in 45 minutes,css transform tutorial,learn to code,css transform 3d,css transform property,learn flexbox in 10 minutes,css transform transition,how to learn css in 12 minutes,learn to code in 15 minutes,transform,learn css transform property,learn css grid in 20 minutes,learn css box model in 8 minutes,learn css,how to learn css,css transforms,transform in css, transform,css transform,css transform property,css transform translate,css transform scale,css transform rotate,css transform tutorial,shape transform effects,css3 transform,transform effects on scroll,css transform 3d,transform scale,css 2d transform,css transform property tutorial,transform clip-path javascript,css ββ Thanks For Watching ββ
Learn CSS - CSS Flex Box | Everything you need to make good websites [With 3 practice designs] Modern Web 2022-01-01 | No matter you are a beginner or pro. If you want to make extraordinary Web sites. If you want make amazing UI/UX, then you must watch this advance CSS series. In this video, weβll talk about CSS flex box. Flex box is important in CSS and with this we can make any sort of web site easily. If you follow this CSS series believe me youβll be able to make amazing websites as I do. In todayβs video, you will learn about flex box, and its use cases, and some of its properties. π Support me in making these videos - paypal.com/paypalme/modernweb617 π Buy me a coffee - buymeacoffee.com/Modernweb π Design 01 - drive.google.com/file/d/1hyTfvacx0vMgMw-1HQ7pqR1xbRyn9chf/view?usp=sharingπ Design 02 - drive.google.com/file/d/1pq95M4STxs2FvkYIJEhpLQCtb6g28uCV/view?usp=sharingπ Design 03 - drive.google.com/file/d/1U8YchJTx0Yjx_8OdGrbikNAfhg8eIYNf/view?usp=sharingFeel Free to ask me if you stuck anywhere, and donβt forget to submit your website by tagging me on my insta @modern_web_channel - Make Full stack Ecom Websiteπ - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7π My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh π Books every programmer must read ππβββββββββββββββββββββββββββClean Code [US] - amzn.to/3ENIjem Clean Code [IN] - amzn.to/3zdD9qW -Mythical Man - Month [US] - amzn.to/32Qn0f9Mythical Man - Month [IN] - amzn.to/3JzILQW-The Pragmatic Programmer: Your Journey To Mastery [US] - amzn.to/3mNOYz8The Pragmatic Programmer: Your Journey To Mastery [IN] - amzn.to/3mNPIEu-Refactoring: Improving the Design of Existing Code [US] - amzn.to/3FMkGnYRefactoring: Improving the Design of Existing Code [IN] - amzn.to/3qHuhG6π Books I read for self development πππβββββββββββββββββββββββββββAtomic Habits [US] - amzn.to/3pLKvyZ Atomic Habits [IN] - amzn.to/3eHpdfu -The subtle art of not giving a f*ck [US] - amzn.to/31iY4wm The subtle art of not giving a f*ck [IN] - amzn.to/32ODgNy -The psychology of money [US] - amzn.to/3sTL9wl The psychology of money [IN] - amzn.to/3eGAbSq -Think like a monk [US] - amzn.to/3eDQNdB Think like a monk [IN] - amzn.to/3FLx73k β° Timestamps β° ββββββββββββ00:00 - Intro00:16 - CSS Series01:15 - CSS Flex Box06:21 - Justify Content09:05 - Align Items10:46 - Flex wrap13:17 - Flex directionIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com You can contact me on - business.modernweb@gmail.comβ€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β website design,how to make responsive website,responsive web design,how to make website,learn to make website using flexbox,learn to make a website using html and css only,web design,how to make a website using flexbox,responsive website design,how to make responsive website in html and css,html css website design tutorial,how to make a website using html and css,how to make a website using html and css,html and css website design tutorial,css,css 2022,learn css,css 2022 news,learn css in one video,learn css for beginners,css 2021,css tutorial,css preparation,css screening test 2022,learn css grid,how to learn css,learn css hindi,learn css in hindi,learn css in 1 hour,css 2022 schedule,learn css in arabic,css ce 2022,html css,css mpt 2022,css preparations 2022ββ Thanks For Watching ββ
HOW TO MAKE A MODERN ECOMMERCE HEADER WITH HTML CSS JS ONLY [ CSS ANIMATIONS / WITH SOURCE CODE Modern Web 2021-12-21 | If you are a beginner or a pro. This video is for everyone who want to make his/her CSS animations on outstanding level. If you want to amaze people with your CSS skills, you must see this video. In this video, youβll learn to create smooth animations to navigate through product lists. Youβll create the design using flex box first and then use different classes to add animations to the element. Youβll also use JS in making this. In total, this will be a lot fun to create. See you in the video ππ Support me in making these videos - paypal.com/paypalme/modernweb617 π Source Code - patreon.com/posts/60169583 π Download Images/app.js - drive.google.com/drive/folders/17w547j2VL5kFo48T_2IDWY51dU4gsMpj?usp=sharing - Make Full stack Ecom Websiteπ - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7You can contact me on - business.modernweb@gmail.comβ° Timestamps β° ββββββββββββ00:00 - Intro00:16 - Modern Header - Demo01:51 - Modern Header - βleft sideβ11:48 - Modern Header - βright sideβ20:26 - Modern Header - animation classes25:24 - Modern Header - app.js32:54 - Modern Header - Done ππ My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh If you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,ββ Thanks For Watching ββ
Make a portfolio website with HTML CSS JS [ CSS Timeline / With Source Code ] Modern Web 2021-12-16 | If you are a beginner or a pro. This video is for everyone who want to make his/her portfolio an outstanding one. In this tutorial, youβll learn to create your own modern looking portfolio website using HTML, CSS and JS. In the video, youβll create smooth transition on navigations, youβll create CSS timeline to showcase your education and experience, youβll make a separate section for your project with a cool hover effect. You must make this portfolio to impress your recruiter. π Support me in making these videos - paypal.com/paypalme/modernweb617 π Source Code - patreon.com/posts/59981873 π Download Images - drive.google.com/drive/folders/1z8ZdauuOMkoYoNWx5NlxjlQbqLHGpPhN?usp=sharing - Make Full stack Ecom Websiteπ - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7β° Timestamps β° ββββββββββββ00:00 - Intro00:16 - Portfolio - Demo02:24 - Portfolio - Navbar07:20 - Portfolio - Home section11:11 - Portfolio - Project Section22:05 - Portfolio - Naviagtion (app.js)25:06 - Portfolio - About Section31:01 - Portfolio - Skills section39:12 - Portfolio - CSS Timeline49:17 - Portfolio - Contact Section57:07 - Great Work! We are doneππ My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh If you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β portfolio website,portfolio website html css,personal portfolio website,how to make a website,how to build a website,portfolio website html css javascript,portfolio website design in html css,responsive portfolio website,create a portfolio website,responsive portfolio website html css javascript,responsive personal portfolio website,how to create website,website layout,create website from scratch html css,how to make a portfolio website,javascript,javascript tutorial,javascript for beginners,learn javascript,javascript tutorial for beginners,javascript course,javascript basics,javascript tutorials,javascript 2020,tutorial javascript,javascript full course,javascript crash course,learn javascript for beginners,javascript beginners,javascript desde cero,kurs javascript,ΡΡΠΎΠΊΠΈ javascript,javascript curso,curso javascript,corso javascript,javascript lesson,curso de javascript,web development,learn web development,web development tutorial,website development,web development tutorial for beginners,web development course,web development roadmap 2020,website design,website,web development 2021,web development 2020,how to build a website,how to create a website,full stack web development course,website development atlanta,website development tutorial,development,web development in telugu,website design and development processββ Thanks For Watching ββ
Javascript Project - How to make unsplash clone | Unsplash API [ With Source Code ] Modern Web 2021-12-09 | This is a beginner friendly javascript tutorial. In this, youβll create unsplash clone using unsplash API. This tutorial focus on building a modern looking unsplash website with searching functionality. Through the video, youβll practice your CSS skills to make this simple modern design. Youβll learn to create mansory grid layout for image. Youβll also learn about image popup and much more things youβll learn. This will be fun to create.π Support me in making these videos - paypal.com/paypalme/modernweb617 π Source Code - patreon.com/posts/59711793π Download Images - drive.google.com/drive/folders/124jJZWLVW2E4HZyUxgVme9qd33RXumkL?usp=sharing - Make Full stack Ecom Websiteπ - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYD- Website Clones [Disney+ / Netflix / YouTube]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPt- Cool CSS amaination that will blow your mindπ€―π₯ - youtube.com/playlist?list=PLqm86YkewF6TEYXEoyVUdDmmIEJ1TzORZ- Make Full stack Blogging Website [ With backend ]π¨βπ» - youtube.com/playlist?list=PLqm86YkewF6RU_k6jymVX7EavJ1w9i4VW- Learn CSSπ₯ - youtube.com/playlist?list=PLqm86YkewF6QHRH9YalmQygIRRDSYYeb7β° Timestamps β° ββββββββββββ00:00 - Intro00:16 - Unsplash Clone - Demo02:09 - Folder Structure02:28 - Unsplash Clone - Header Section11:12 - Unsplash Clone - Mansory Layout Image Gallery14:25 - Unsplash API22:30 - Image Popup38:04 - Unspalsh Clone - Search Page46:07 - Outroπ My setup π₯ βββββββββMacBook Air M1 2020 [IN] - amzn.to/3Cu1hWcMacBook Air M1 2020 [US] - amzn.to/3DBEAkd-Maono AU-PM461TR Mic [IN] - amzn.to/2YYna2fMaono AU-PM461TR Mic [US] - amzn.to/3HQFNHh If you like this tutorial make sure to hit like button and show your support by subscribing my channel.Social Media π₯πβββββββββββYouTube - youtube.com/c/modern_web?sub_confirmation=1Instagram - instagram.com/the.modernwebDev.to - dev.to/kunaal438Website - modernwebtutorials.herokuapp.com β€οΈβ€οΈ Have a nice day β€οΈβ€οΈ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,β Tags π β unsplash api,unsplash,unsplash api javascript,javascript project,how to use unsplash api,unsplash app,javascript project with unsplash,using unsplash to get a random image with javascript,how to query unsplash api,javascript projects for beginners,unsplash photos,unsplash random image,javascript,javascript project tutorial,javascript projects,how to get a random image from unsplash,unsplash javascript api,unsplash api javascript example,unsplash tutorial,javascript project,javascript,javascript projects,javascript tutorial,javascript projects for beginners,javascript project tutorial,learn javascript,javascript project ideas,javascript project in hindi,vanilla javascript,javascript projects for practice,javascript tutorial for beginners,10 javascript projects,html css javascript project,easy javascript projects,javascript tutorial project,vanilla javascript projects,javascript beginner projects,web development,learn web development,web development tutorial,website development,web development tutorial for beginners,web development 2021,web development roadmap 2020,website,web development 2020,how to create a website,website design,website development atlanta,website development tutorial,how to build a website,development,web development in telugu,website design and development process,web development course,what is web developmentββ Thanks For Watching ββ
Add products in cart and let them checkout [ Step by Step Tutorial ] Modern Web 2021-10-18 | Fullstack e-commerce Series - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYDPart 4 - Ecommerce website - Cart and checkout pure HTML, CSS and JSIn this video, you'll add dynamic pages and product slider along with working search page. You'll also add cart/wish list button with checkout page and order confirmation emailSource Code - patreon.com/posts/57545877Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelDownload Images - drive.google.com/drive/folders/1H7ALfzZK2MppF4fxkJyZAgKEHJ4XMKPM?usp=sharingIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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
Fullstack Demo - How to make an e-commerce website with HTML, CSS and JS Modern Web 2021-10-09 | Fullstack Demo - How to make an e-commerce website with HTML, CSS and JSFullstack e-commerce Series - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYDThis video is the demo video of full stack e commerce video made by only HTML, CSS and JS. IN this video you'll sett what we'll create in the last part of this series. To stay tune, and never miss the awesome web tutorials, make sure to subscribe the channel. Also share this with your colleagues. Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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
Add products in firebase using form [ Dynamic Product Pages too ] Modern Web 2021-10-04 | Fullstack e-commerce Series - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYDPart 3 - How to make an e-commerce website with HTML, CSS and JSThis is a third part of fullstack e-com website. In this part, you'll make a product adding feature, which is very big feature. We'll see how to validate forms before storing to database, we'll see how to upload image on aws from front end, and we also add delete product, edit product, and much more.Source Code - patreon.com/posts/56979686Download Images ( CORS File also ) - drive.google.com/drive/folders/1eIWchzFD2XELCwTwztOvYLYJsDDNvCQb?usp=sharingBuy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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 useMusic Credit -Song: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkY#ecommercewebsite #websitedevelopment #wesitedesign #html #css #js #webdev #web #html5 #css3 #htmlcss #javascript #nodejs #npm #fullstackdev #frontend #backend #onepagewebsite #onlinetutorial
Setup Login and dashboard for the online store Modern Web 2021-09-24 | Fullstack e-commerce Series - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYDPart 2 - How to make an e-commerce website with HTML, CSS and JSThis is a second part of fullstack e-com website. In this part, you'll make a node server to run website on localhost, then you'll learn to do form validations. And storing user in firestore. In total, in this video we'll make signup page/ login page, logout feature and sellers dashboard.Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelSource Code - patreon.com/posts/56549627Download Images - drive.google.com/drive/folders/1EUSwq1vEzyUm9w1w0PHJ_egD0HXXhZO4?usp=sharingChar variable of token.js = "let char = `123abcde.fmnopqlABCDE@FJKLMNOPQRSTUVWXYZ456789stuvwxyz0!#$%&ijkrgh'*+-/=?^_${'`'}{|}~`; "If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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
Look how easily I created the online store [ Step by Step Tutorial ] - 01 Modern Web 2021-09-13 | Fullstack e-commerce Series - youtube.com/playlist?list=PLqm86YkewF6S45smPYeNv01aFFKWZSgYDFullstack Social Media website - youtube.com/playlist?list=PLqm86YkewF6QY31_HM3RJqmD38PqgsJT1Part 1 - How to make an e-commerce website with HTML, CSS and JSIn 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 - patreon.com/posts/56103891Buy Me a coffee - buymeacoffee.com/Modernweb/e/62280Support me in making these videos - paypal.me/modernwebchannelDownload Images - drive.google.com/drive/folders/1W04u0_ArXUPFQss4F5nrfgSw31R2pgDn?usp=sharingIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€ββββββββββββββββββββββββββββββOver You - Atch soundcloud.com/atch-musicCreative Commons β Attribution 3.0 Unported β CC BY 3.0Free Download / Stream: http://bit.ly/_over-youMusic promoted by Audio Library youtu.be/rlBuOflkHSkββββββββββββββββββββββββββββββ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
How to make a designing website with HTML, CSS and JS. Visiting card Designer Modern Web 2021-09-07 | How to make a designing website with HTML, CSS and JS. Visiting card DesignerHello, In today's video you'll learn to create awesome visiting card designer. Where you can add company logo, its slogan, website link and support email. You can also change the visiting card background. And the best thing you can also download the designed visiting card on your system.Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelSource Code - patreon.com/posts/55869426Time Stamps00:00 - Intro00:16 - Demo01:54 - Make Website UI17:33 - App.js26:01 - Creating Node Server29:11 - DoneIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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
How to create Music player with pure HTML, CSS, JS Modern Web 2021-09-04 | How to create Music player with pure HTML, CSS, JSIn this video, you'll learn to create awesome music player with pure HTML, CSS and JS. Our music player has modern looking designs, with cool animations like play/pause animation, disk rotating animation and pulse animation. Our music player has working forward/backward buttons with seek-able song slider.Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannelSource Code - patreon.com/posts/55755212Download Images/Music/Data.js File - drive.google.com/drive/folders/1xLHnOMpWgOiQLHY6hpUQZ5CKf2MT1Sog?usp=sharingIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Time Stamps - 00:00 - Intro00:16 - Demo02:05 - Next Tutorial Topic02:28 - Folder Structure02:49 - data.js 03:11 - Desigin the music player21:25 - app.js35:25 - DoneπSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channel--Music Credit--ββββββββββββββββββββββββββββββSoaring by Ghostrifter Official https://soundcloud.com/ghostrifter-of... Creative Commons β Attribution-ShareAlike 3.0 Unported β CC BY-SA 3.0Free Download / Stream: bit.ly/al-soaringMusic promoted by Audio Library β’ Soaring β Ghostri... βββββββββββββββββββββββββββββββ€β€ Have a nice day β€β€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
Tile Navigation - How to make navbar for web page with HTML CSS and JS in 2021 Modern Web 2021-09-01 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Tile Navigation - How to make navbar for web page with HTML CSS and JS in 2021Tile navigation is very unique navigation that you'll not found most. Make a good impression by using tile navigation on your portfolio. This navigation has good UX which makes better experience than normal navbar.πSource Codeπpatreon.com/posts/55615263Another Tile navigation tutorial - youtu.be/EsD3QY_wFm8If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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#cssnavbar #htmlcss #cssnav #navbar #websitenavbar #htmlnav #csstricks #htmlcss #html5 #webdeveloment
HOW TO CREATE A WORKING BLOGGING WEBSITE WITH PURE HTML, CSS AND JS IN 2021.TO COMPLETE TASK QUICKLY Modern Web 2021-08-29 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Advance Features - How to create a working blogging website with pure HTML, CSS and JS in 2021.πSource Codeπpatreon.com/posts/55471591πPart 1πyoutube.com/watch?v=AWHGQfzfHxIThis video is the part of blogging website with HTML, CSS and JS. In this we used the previous video's code and added more advance features to it. Like -1. Google Authentication using firebase - Login/Logout2. User dashboard where he can access his written blogs3. Now you can edit and delete the blog from the dashboard.4. And also edit the blog from blog page itself.5. Added author name in the blog also.πWebsite Clone Playlistπyoutube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPtTime stamps - 00:00 - Intro00:16 - Demo02:58 - Folder Structure03:38 - Server.JS04:53 - Login12:12 - Dashboard14:26 - nav.JS17:24 - editor.JS adding author to the blog20:41 - blog.JS displaying author username21:21 - Dashboard fetching blogs24:07 - Delete blog25:32 - edit button on blog page & some minor fixes28:37 - edit the blog feature35:25 - deploying on herokuIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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#bloggingwebsite #blogging #fullstackdevelopment #fullstack #firebase #nodejs #backend #frontend
HOW TO MAKE FULLY RESPONSIVE MODERN PORTFOLIO USING PURE HTML, CSS AND JS.! Really Works Modern Web 2021-08-21 | How to make fully responsive modern portfolio using pure HTML, CSS and JS. Working Contact form alsoIn today's video you'll learn to create this awesome modern looking personal portfolio using only HTML, CSS and JS. You learn to create responsive design, you'll learn about CSS pseudo elements. You'll learn about nodemailer to make a working contact form. And much more.πSource Codeπpatreon.com/posts/how-to-make-pure-55160233Time Stamp00:00 - Intro00:16 - Demo02:53 - Folder Structure03:25 - Server.JS06:07 - Navbar11:32 - Home Section16:48 - About Section27:38 - Project Section39:04 - Contact Section & Nodemailer52:50 - Responsive StylesIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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ββββββββββββββββββββββββββββββSoaring by Ghostrifter Official https://soundcloud.com/ghostrifter-of... Creative Commons β Attribution-ShareAlike 3.0 Unported β CC BY-SA 3.0Free Download / Stream: bit.ly/al-soaringββββββββββββββββββββββββββββββ#portfolio #htmlcss #webdevelopment #responsivewebsite
How to make personal portfolio with HTML, CSS and JS | Working Contact Form NodeJS Modern Web 2021-08-18 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel How to make personal portfolio with HTML, CSS and JS | Working Contact Form NodeJSThis video is a trailer/demo video of the actual coding tutorial. Tutorial is coming soon so don't forget to subscribe my channel to stay tune. This personal portfolio is a a static website but run on a nodeJS server for mail functions. This website is fully responsive and have dark theme. Comment your thought about this project.If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€#portfoliowebsite #website #htmlcss #js
FullStack - How to create a working blogging website with pure HTML, CSS and JS in 2021. Modern Web 2021-08-13 | Advance features video - youtu.be/EK_emZ1_DGoFo those who find it difficult because of latest firebase. Instead of linking latest firebase add these scripts to your code."cdnjs.cloudflare.com/ajax/libs/firebase/8.10.1/firebase-firestore.js" -- firestore link"cdnjs.cloudflare.com/ajax/libs/firebase/8.10.1/firebase-app.js" -- firebase linkAnd follow the videoFullStack - How to create a working blogging website with pure HTML, CSS and JS in 2021.This is a very good project to practice full-stack development. When I started with web development I always thought how can I make my own blogging website. And today, I am proud that I tried to make blogging site. Our website is very simple and has features like1. Dynamic Blog pages.2. Have a dedicated editor for blogs.3. You can add/make as many blogs you want.4. You can add Headings, paragraphs, and Images to the blog post. 5. Have read more blogs section also.πWebsite Clone Playlistπyoutube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPtπSource Codeπgithub.com/kunaal438/blogging-siteTime stamps - 00:00 - Intro00:26 - Demo03:17 - Folder Structure04:14 - NPM init / Packages Installation05:18 - Server.js07:10 - home page15:56 - editor page23:56 - file upload33:55 - firebase setup36:24 - publish post43:23 - Blog page47:16 - blog.js58:40 - blog cardsIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€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#bloggingwebsite #blogging #fullstackdevelopment #fullstack #firebase #nodejs #backend #frontend
[Demo] FullStack Development - Fully working Blogging website coding tutorial Modern Web 2021-08-11 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel [Demo] FullStack Development - Fully working Blogging website coding tutorial.Subscribe channel to stay tune for tutorial video.If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€
TMDB API - How to create netflix clone. Netflix clone with HTML,CSS, JS. Node JS Web app 2021 Modern Web 2021-08-08 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel TMDB API - How to create netflix clone. Netflix clone with HMTL,CSS, JS. Dynamic Node JS Web appNetflix Clone, we all use netflix in our day to day life. And if you are just starting with web development. This project can be a good practice project for you. This netflix clone is a dynamic site and has everything you need for fullstack development practice. It runs on a Node.js server. It uses TMDB API for all data.Features1. Looks similar to Netflix.2. Dynamic site run on Node.js server.3. All data is coming from TMDB API.4. Dedicated Dynamic Movies Info page.5. Has movie trailers, and recommendations.6. Has smooth card slider effect.πWebsite Clone Series πyoutube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPtIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.Time stamps:00:00 - Intro00:17 - Demo02:29 - Question02: 35 - Folder Structure03:34 - NPM init04:06 - Installing NPM libraries04:51 - Server.js07:01 - Homepage20:13 - TMDB API Key22:03 - api.js22:46 - home.js32:12 - scroll.js34:44 - server.js36:41 - About page42:18 - Youtube Iframe46:03 - about.jsπSource Codeπgithub.com/kunaal438/netflix-clone-2.0πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€Music CreditββββββββββββββββββββββββββββββOver You - Atch soundcloud.com/atch-musicCreative Commons β Attribution 3.0 Unported β CC BY 3.0Free Download / Stream: http://bit.ly/_over-youMusic promoted by Audio Library youtu.be/rlBuOflkHSkββββββββββββββββββββββββββββββHip Hop Rap Instrumental (Crying Over You) by christophermorrow soundcloud.com/chris-morrow-3Creative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: http://bit.ly/2AHA5G9Music promoted by Audio Library youtu.be/hiYs5z4xdBUββββββββββββββββββββββββββββββSong: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkYββββββββββββββββββββββββββββββHappy by Mike Leite soundcloud.com/mikeleite Creative Commons β Attribution 3.0 Unported β CC BY 3.0 Free Download / Stream: bit.ly/al_happyMusic promoted by Audio Library youtu.be/TlwWc-6dZigββββββββββββββββββββββββββββββCool by Tobu soundcloud.com/7obuCreative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: bit.ly/cool-tobuMusic promoted by Audio Library youtu.be/lbMraHEhdgMββββββββββββββββββββββββββββββVibe With Me by Joakim Karud http://soundcloud.com/joakimkarudMusic promoted by Audio Library youtu.be/-7YDBIGCXsYββββββββββββββββββββββββββββββ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#netflixclone #websiteclone #tmdbapi #netflix
Checkbox CSS : Style Gradient Checkbox with pure CSS. Custom Input CSS Modern Web 2021-08-03 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Checkbox CSS : Style Gradient Checkbox with pure CSS. Custom Input CSSCheckbox are widely use in these days to collect data from user. We all have seen checkbox a lot. Today in this video you'll learn to style checkbox and give it a gradient background. This checkbox looks good. What you say about it ??If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€Music Credit______________________________________________________________Track: Syn Cole - Gizmo [NCS Release]Music provided by NoCopyrightSounds.Watch: youtu.be/pZzSq8WfsKoFree Download / Stream: http://ncs.io/Gizmo
How to make Button Hover Effect | Create Pure CSS Wavy Design | HTML | CSS Modern Web 2021-08-01 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Create Awesome Wavy Button Hover Effect. Pure CSS Wavy Design | HTML | CSSButton play very important role in any websites. In today's video you'll learn to make awesome button hover effect. You'll be creating a pure wave shape with CSS. No image is used for this effect.If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagramπinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€Music Credit______________________________________________________________Time Out - Atch soundcloud.com/atch-musicCreative Commons β Attribution 3.0 Unported β CC BY 3.0Free Download / Stream: http://bit.ly/l-time-outMusic promoted by Audio Library youtu.be/NPnLxESfv50ββββββββββββββββββββββββββββββ#csstricks #cssanimations #webdev #csstransitions #css
Youtube API - How to make youtube Clone | Fully working youtube clone with HTML, CSS, JS Modern Web 2021-07-30 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Youtube API - How to make youtube Clone | Fully working youtube clone wiht HTML, CSS, JSYoutube is a very popular video serving platform. Learn to create youtube Home page clone with HTML, css and JS . Learn about youtube API to fetch youtube data and learn to process the fetched data.If you like this tutorial make sure to hit like button and show your support by subscribing my channel.Correction 35:25 - Here pass the variable after the arrow not before.πSubscribe My Channelπ youtube.com/c/modern_web?sub_confirmation=1π Source Code πgithub.com/kunaal438/youtube-cloneπ Follow me on Instagram πinstagram.com/modern_web_channelTime Stamps00:00 - Intro00:16 - Demo01:26 - Navbar10:52 - Sidebar15:45 - Filters20:09 - Video Card25:33 - Creating Youtube API key27:53 - Fetching Data from Youtube API & Creating Video Cards36:39 - Making Search Box Functionalβ€β€ Have a nice day β€β€#youtubeclone #youtubeApi #webdev #1
How to make infinity loading animation | CSS Quick tip | Loading animation Modern Web 2021-07-24 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel How to make infinity loading animation | CSS Quick tip | Loading animationIn today's video learn to create this awesome loading animation with infinity effect. Having a loading animation or loader for your website is good. So user make sure that your site is working. If you like this tutorial make sure to hit like button and show your support by subscribing my channel.πSubscribe My Channel πyoutube.com/c/modern_web?sub_confirmation=1πFollow me on Instagram πinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€Music Credit______________________________________________________________Song: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkY
Gradient Text Border | How to make gradient Text stroke | Quick CSS trick Modern Web 2021-07-22 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Gradient Text Border | How to make gradient Text stroke | Quick CSS trickIf you like this tutorial make sure to hit like button and show your support by subscribing my channel.π Subscribe My Channel πyoutube.com/c/modern_web?sub_confirmation=1π Follow me on Instagram πinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€Music Credit______________________________________________________________Cool by Tobu soundcloud.com/7obuCreative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: bit.ly/cool-tobuMusic promoted by Audio Library youtu.be/lbMraHEhdgMββββββββββββββββββββββββββββββ
Disney+ clone for beginner in 2021 | HTML5 | CSS3 | JS #webdevelopment Modern Web 2021-07-19 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Make disney plus clone | Disney+ clone for beginner in 2021 | HTML5 | CSS3 | JS π.Welcome, In today's video you'll be learn to create Disney+ UI clone with HTML, CSS and Javascript only. This video is a part of series where I made tutorial video on various site clones like netflix, disney plus, amazon etc. So if you are interested make sure you hit that subscribe button and enable notification to never miss my video. πDownload Started Template πgithub.com/kunaal438/disney-plus-cloneπClone Seriesπyoutube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPtTimestamp00:00 - Intro00:16 - Demo02:05 - Folder Structure02:34 - Data.js02:46 - Navbar09:24 - Endless Carousel21:06 - Video cards25:33 - Movie Cards37:42 - DoneIf you like this tutorial make sure to hit like button and show your support by subscribing my channel. πSubscribe My Channel πyoutube.com/c/modern_web?sub_confirmation=1 πFollow me on Instagram πinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€#htmlcss #webdevelopment #websiteclone #disney #csseffect #css #jsMusic CreditββββββββββββββββββββββββββββββHip Hop Rap Instrumental (Crying Over You) by christophermorrow soundcloud.com/chris-morrow-3Creative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: http://bit.ly/2AHA5G9Music promoted by Audio Library youtu.be/hiYs5z4xdBUββββββββββββββββββββββββββββββSong: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkYββββββββββββββββββββββββββββββHappy by Mike Leite soundcloud.com/mikeleite Creative Commons β Attribution 3.0 Unported β CC BY 3.0 Free Download / Stream: bit.ly/al_happyMusic promoted by Audio Library youtu.be/TlwWc-6dZigββββββββββββββββββββββββββββββCool by Tobu soundcloud.com/7obuCreative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: bit.ly/cool-tobuMusic promoted by Audio Library youtu.be/lbMraHEhdgMββββββββββββββββββββββββββββββVibe With Me by Joakim Karud http://soundcloud.com/joakimkarudMusic promoted by Audio Library youtu.be/-7YDBIGCXsYββββββββββββββββββββββββββββββ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
Instagram UI Clone 2021 | Make Responsive Instagram Clone with HTML, CSS UI only. Modern Web 2021-07-13 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel Instagram Clone 2021 | Make Responsive Instagram Clone with HTML, CSS UI onlyπ.Welcome, In today's video you'll be learn to create Instagram UI clone with HTML, CSS only. This video is a part of upcoming series where I'll make tutorial video on various site clones like netflix, disney plus, amazon etc. So if you are interested make sure you hit that subscribe button and enable notification to never miss my video. πDownload Images Here πdrive.google.com/drive/folders/1ePPSYC_SUS19gJq4fFQhdtwP_pOugbAy?usp=sharingπClone Seriesπyoutube.com/playlist?list=PLqm86YkewF6Sj_DbZ6WXqiLjw1tBZKNPtTimestamp00:00 - Intro00:16 - Demo02:34 - Navbar08:51 - Status Section15:27 - Post27:15 - Recommendations section33:17 - Making ResponsiveIf you like this tutorial make sure to hit like button and show your support by subscribing my channel. πSubscribe My Channel πyoutube.com/c/modern_web?sub_confirmation=1 πFollow me on Instagram πinstagram.com/modern_web_channelβ€β€ Have a nice day β€β€#htmlcss #webdevelopment #instagramclone #cssMusic CreditββββββββββββββββββββββββββββββHip Hop Rap Instrumental (Crying Over You) by christophermorrow soundcloud.com/chris-morrow-3Creative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: http://bit.ly/2AHA5G9Music promoted by Audio Library youtu.be/hiYs5z4xdBUββββββββββββββββββββββββββββββSong: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkYββββββββββββββββββββββββββββββHappy by Mike Leite soundcloud.com/mikeleite Creative Commons β Attribution 3.0 Unported β CC BY 3.0 Free Download / Stream: bit.ly/al_happyMusic promoted by Audio Library youtu.be/TlwWc-6dZigββββββββββββββββββββββββββββββTrack: T-Mass & Britt Lari - Like Me [NCS Release]Music provided by NoCopyrightSounds.Watch: youtu.be/iQrYoJ5tRV8Free Download / Stream: http://ncs.io/LikeMe- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -Track: Electro-Light - Where It All Began (feat. Danyka Nadeau) [NCS Release]Music provided by NoCopyrightSounds.Watch: youtu.be/VQ-thOWn-pwFree Download / Stream: http://ncs.io/WhereItAllBegan- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
how to create awesome card hover effect 2021 | you have never seen it before. Modern Web 2021-07-10 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel #css3 #csscard #cssanimatio #cssux #modernwebCSS card hover effect 2021 | card html, css | Awesome card hover effect. If you like this tutorial make sure to hit like button and show your support by subscribing my channel.π Subscribe My Channelπyoutube.com/c/modern_web?sub_confirmation=1π Follow me on Instagram πinstagram.com/modern_web_channelπDownload Videoπdrive.google.com/file/d/1gl-eQSF3y6_sPTWJpZ-Hidryf4C4E_HG/view?usp=sharingβ€β€ Have a nice day β€β€Music Credit______________________________________________________________Hip Hop Rap Instrumental (Crying Over You) by christophermorrow soundcloud.com/chris-morrow-3Creative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: http://bit.ly/2AHA5G9Music promoted by Audio Library youtu.be/hiYs5z4xdBU_______________________________________________________________________Song: MBB - Island (Vlog No Copyright Music)Music provided by Vlog No Copyright Music.Video Link: youtu.be/0fLMSubepkY______________________________________________________________________Track: T-Mass - Ignoring My Heart [NCS Release]Music provided by NoCopyrightSounds.Watch: youtu.be/eT0tYnWX2sQFree Download / Stream: http://ncs.io/ignoringmyheartYO
How to create Music player with pure HTML, CSS, JS | Learn to create music player in 2023 Modern Web 2021-07-05 | How to create Music player with pure HTML, CSS, JS. Learn to create a working music player using plain Javascript. In this tutorial you will not only learn Javascript to create this music player but you will learn to create smooth animations and transitions using CSS and JS.πDownload assets and data.js file drive.google.com/folderview?id=1hGbYfwa7bHjkp2Zm4GoW-4EOTAWIVR4CπDownload Source Code - patreon.com/posts/53316409πBuymeacoffee ( if above link doesn't work ) - buymeacoffee.com/Modernweb/e/128204π Social Links βββββββββInstagram - instagram.com/themodernwebFacebook - facebook.com/themodernweb Twitter - twitter.com/modernweb438 Dev.to - dev.to/themodernwebSubscribe - youtube.com/c/modernweb?sub_confirmation=1Mail - business.modernweb@gmail.comThis is modern web, I am Kunaal content on web development, So if you want to master web development make sure to subscribe to the channel.β°Time Stampsβ°00:00 - Intro00:17 - Demo03:27 - Folder structure04:06 - Home Section13:32 - Music Player Section27:56 - Playlist Section33:19 - carousel34:52 - Navigation39:34 - Music Player JSβ€β€ Have a nice day β€β€Thanks for watching --------------------- π Tags ---------create music player in javascript,music player,music player javascript,music player using html css javascript,how to create a music player,music player in javascript,html css javascript music player,how to make music player in javascript,music player html css js,javascript music player,javascript music player tutorial,music player app in javascript,music player website html,html music player,how to create music player with pure html css js,music player javascript,javascript music player,music player,music player in javascript,html css javascript music player,create music player in javascript,javascript music player tutorial,music player using html css javascript,javascript,javascript music player app,javascript music app,music player app in javascript,audio player using css and javascript,custom music player in javascript,javascript project,music app using javascript#javascript #musicplayer #htmlcss #webdev
How to make a share button html | Awesome button effect CSS | Modern web Coding Tutorial Modern Web 2021-07-01 | Get My all sources code - Buy Me a coffee - Support me in making these videos - paypal.me/modernwebchannel How to make a share button html | Awesome button effect CSS | Modern web Coding TutorialShare Button is very useful in this days as everything is online and everybody uses social media. Share button is used to enable sharing image, audio, link or anything. We'll make share options UI only.If you like this tutorial make sure to hit like button and show your support by subscribing my channel.π Subscribe My Channel πyoutube.com/c/modern_web?sub_confirmation=1π Source Code πgithub.com/kunaal438/share-buttonπ Follow me on Instagram πinstagram.com/modern_web_channelβ Download Icons.txt file - github.com/kunaal438/share-button/blob/master/icons.txtβ Library Used - Font awesome Library.β What you'll learn in this video β1. HTML2. CSS3. JavaScript (toggling classes)Video you may find useful - 1. How to make header in html and css for website | Awesome header - youtube.com/watch?v=eCFFbjFvjKM2. How to make header in css | Fully animated modern header - youtube.com/watch?v=fQcA1MBRvY03. Css responsive card hover effect for beginners | awesome card hover animation in 2021 - youtube.com/watch?v=b2jsWL1cDKE4. How to make a custom Select Input. Fully working Custom Options Input. - youtube.com/watch?v=3J96G5lnZ2E5. How to make login forms in html and css | login form animation CSS for beginners - youtube.com/watch?v=R_MutcGu_xEβ€β€ Have a nice day β€β€#csseffects #cssbutton #css3 #webdev#webdevelopmentMusic Credit______________________________________________________________Hip Hop Rap Instrumental (Crying Over You) by christophermorrow soundcloud.com/chris-morrow-3Creative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: http://bit.ly/2AHA5G9Music promoted by Audio Library youtu.be/hiYs5z4xdBU______________________________________________________________Vibe With Me by Joakim Karud http://soundcloud.com/joakimkarudMusic promoted by Audio Library youtu.be/-7YDBIGCXsY______________________________________________________________Cool by Tobu soundcloud.com/7obuCreative Commons β Attribution 3.0 Unportedβ CC BY 3.0 Free Download / Stream: bit.ly/cool-tobuMusic promoted by Audio Library youtu.be/lbMraHEhdgM______________________________________________________________Island by MBB soundcloud.com/mbbofficialCreative Commons β Attribution-ShareAlike 3.0 Unportedβ CC BY-SA 3.0 Free Download / Stream: bit.ly/Island-MBBMusic promoted by Audio Library youtu.be/6by8zhaG04Y
