Time To Program
Time To Program
  • Видео 33
  • Просмотров 330 438
Full Stack Travel Story App Using MERN Stack | MongoDB, Express, React, Node.js | MERN Project
In this video, we will build a Full Stack Travel Story App using the MERN stack (MongoDB, Express, React, Node.js). This app allows users to sign up, log in, and create personal travel stories with features like image uploads, and adding travel date. We also implement search functionality to find stories, filter by date range, and pin favorite stories to the top. Users can also edit or delete their stories..
The backend features secure JWT authentication, MongoDB for storing user data and travel stories, and APIs for adding, editing, deleting stories, and uploading images. This tutorial covers the entire development process, from setting up the frontend and backend to integrating APIs and...
Просмотров: 26 878

Видео

Responsive Portfolio Website Using React JS and Tailwind CSS | Portfolio Website in React.Js
Просмотров 5 тыс.5 месяцев назад
In this video, we will learn how to build a responsive portfolio website using React JS and Tailwind CSS. The website will include a navbar, hero section, skills section, work experience section, about me section, contact section, and a minimal footer. Get Source Code: buymeacoffee.com/timetoprogram/e/267577 🕚 Timestamps: 00:00 Demo: Responsive Portfolio Website 01:49 Project Setup 05:31 Tailwi...
Build a Full Stack Notes App using MERN | MongoDB, Express, React JS, Node JS
Просмотров 99 тыс.8 месяцев назад
In this video, we will build a Full Stack Notes App using MERN (MongoDB, Express, React JS, Node JS). Our Notes App contains functionalities like Authentication (Login & Sign Up), Adding/Edit Notes, Pin important notes to the top, and searching through the notes. Get Source Code: www.buymeacoffee.com/timetoprogram/e/242757 🕚 Timestamps: Frontend React Project Setup 00:00 Demo of Notes App 03:12...
Build a Responsive Website Using React JS & Tailwind CSS | Beginner React JS Project
Просмотров 6 тыс.10 месяцев назад
In this video, we will build a responsive website using React JS and Tailwind CSS. The website we are going to build in this tutorial is a construction landing page website. The website will consist of a navbar, hero section, stats section, services section, our work section, testimonials section, call to action section and a minimal footer. Get Source Code: www.buymeacoffee.com/timetoprogram/e...
Creating Animated Expandable Card Using Framer Motion and React JS
Просмотров 1,6 тыс.11 месяцев назад
In this video,In this video, we will learn how to create an animated expandable card using framer motion and React JS. When animated expandable card component is clicked we will reveals additional content smoothly including an image and description. Support me with a donation: www.buymeacoffee.com/timetoprogram Get source code from our website: timetoprogram.com 🕚 Timestamps: 00:00 Demo of Anim...
How to Upload File With Progress Bar in React JS
Просмотров 15 тыс.11 месяцев назад
In this video, we will learn how to upload a file with a progress bar in React JS. We will covered setting up the file upload component, handling file selection, displaying file information, and implementing the upload functionality. Support me with a donation: www.buymeacoffee.com/timetoprogram Get source code from our website: timetoprogram.com 🕚 Timestamps: 00:00 Demo of Uploading File With ...
Build a Responsive Portfolio Website Using React JS | Portfolio Website in React
Просмотров 119 тыс.11 месяцев назад
In this video, we will learn how to build a responsive portfolio website using React JS. The portfolio website we build in this tutorial will consist of a navbar, hero section, skills or technical proficiency section, work experience section, contact section, and a simple footer. Get Source Code: www.buymeacoffee.com/timetoprogram/e/197167 🕚 Timestamps: 00:00 Demo Responsive Portfolio Website 0...
How To Create a Custom Tooltip Component in React JS
Просмотров 2,6 тыс.11 месяцев назад
In this video, we will learn how to create a custom tooltip component from scratch in React JS, building a custom animated tooltip component in React #react #reactjs #reactjstutorial Get source code from our website: timetoprogram.com 🕚 Timestamps: 00:00 Demo of Custom Tooltip Component in React 00:10 Project setup 00:56 Creating Tooltip component 01:38 Using Tooltip component in App.jsx 02:27 ...
How To Create a Custom Reusable Modal Component in React JS
Просмотров 76711 месяцев назад
In this video, we will learn how to create a custom reusable modal component from scratch in React JS, building a modal component in React #react #reactjs #reactjstutorial Get source code from our website: timetoprogram.com Also, check out: How To Create Custom File Input Component in React ruclips.net/video/F3W_lZzzA3c/видео.html Creating Increment Decrement Counter Button in React ruclips.net...
How To Create Custom File Input Component in React JS
Просмотров 2,4 тыс.Год назад
In this video, we will implement a simple custom file input component in React JS, open the file input on the button click in React #react #reactjs #reactjstutorial Get source code from our website: timetoprogram.com Also, check out: Creating Increment Decrement Counter Button in React ruclips.net/video/s8qMfDPGKxo/видео.html Create Dark Mode Toggle Switch in HTML CSS ruclips.net/video/L0YlJ5KX...
Creating Increment Decrement Counter Button in React | Quantity Selector Button in React
Просмотров 1,5 тыс.Год назад
Learn how to create Increment Decrement Counter Button in React JS, create a quantity selector button in React #react #reactjs #reactjstutorial Get source code from our website: timetoprogram.com Also, check out: Create Dark Mode Toggle Switch in HTML CSS ruclips.net/video/L0YlJ5KXWqo/видео.html How To Create a Custom Accordion in React JS ruclips.net/video/uQj51j5Jb-w/видео.html Create a Simpl...
How To Create Dark Mode Toggle Switch in HTML CSS
Просмотров 1,7 тыс.Год назад
Learn how to create a custom dark mode toggle switch in HTML CSS, create a dark/light mode toggle switch button using HTML and CSS #htmlcsstutorial #javascript #css Support me with a donation: www.buymeacoffee.com/timetoprogram Get source code from our website: timetoprogram.com Also, check out: How To Create a Custom Accordion in React JS ruclips.net/video/uQj51j5Jb-w/видео.html Create a Simpl...
How To Create a Custom Accordion in React JS
Просмотров 561Год назад
Learn how to create a custom accordion in React JS, add a dynamic accordion in React JS #react #reactjs #reactjstutorial Get source code from our website: timetoprogram.com Also, check out: How To Create Price Range Slider Using HTML ruclips.net/video/VQGDBbxDAYA/видео.html How to Create a Horizontal Scrolling Component with Buttons in React ruclips.net/video/1kVZEhg3Q_c/видео.html How To Gener...
How To Create Price Range Slider Using HTML, CSS and JavaScript
Просмотров 1,4 тыс.Год назад
Learn how to create price range slider using HTML, CSS and JavaScript, Creating range slider in html css #htmlcsstutorial #javascript #css Get source code from our website: timetoprogram.com Also, check out: Create Simple Image Carousel in HTML CSS and JavaScript ruclips.net/video/T5eV6cNzzsU/видео.html How To Create Dynamic Input Fields in React ruclips.net/video/zZwprisnz6o/видео.html How to ...
How To Create Simple Image Carousel in HTML CSS and JavaScript
Просмотров 968Год назад
Learn how to create a simple image carousel in HTML CSS and JavaScript, an image slider using HTML, CSS, and Javascript #htmlcsstutorial #javascript #css Get source code from our website: timetoprogram.com Also, check out: How To Create Dynamic Input Fields in React ruclips.net/video/zZwprisnz6o/видео.html How to Create a Horizontal Scrolling Component with Buttons in React ruclips.net/video/1k...
How To Create Dynamic Input Fields in React
Просмотров 2 тыс.Год назад
How To Create Dynamic Input Fields in React
How to Create a Horizontal Scrolling Component with Buttons in React
Просмотров 7 тыс.Год назад
How to Create a Horizontal Scrolling Component with Buttons in React
How To Generate Random Password in React JS
Просмотров 418Год назад
How To Generate Random Password in React JS
How To Build Simple Audio Player in React JS | Music Player in React
Просмотров 2,4 тыс.Год назад
How To Build Simple Audio Player in React JS | Music Player in React
How to Create Image Magnifier in React JS
Просмотров 3,5 тыс.Год назад
How to Create Image Magnifier in React JS
How To Search Filter Array of Objects in React JS
Просмотров 624Год назад
How To Search Filter Array of Objects in React JS
How to Validate File Type in React JS | Check File Type in React
Просмотров 895Год назад
How to Validate File Type in React JS | Check File Type in React
How To Check Password Strength in React JS
Просмотров 558Год назад
How To Check Password Strength in React JS
How To Create Checkbox List in React JS
Просмотров 904Год назад
How To Create Checkbox List in React JS
How To Create Horizontal Drag and Drop List in React JS
Просмотров 848Год назад
How To Create Horizontal Drag and Drop List in React JS
How To Create a Simple Like Dislike Button in React JS
Просмотров 1 тыс.Год назад
How To Create a Simple Like Dislike Button in React JS
How to Convert CSV File Data to JSON in React JS
Просмотров 989Год назад
How to Convert CSV File Data to JSON in React JS
How to Create Image Zoom In/Out Component in React JS
Просмотров 3,9 тыс.Год назад
How to Create Image Zoom In/Out Component in React JS
Password And Confirm Password Validation in React JS
Просмотров 5 тыс.Год назад
Password And Confirm Password Validation in React JS
How To Crop Image Before Upload in React JS
Просмотров 7 тыс.Год назад
How To Crop Image Before Upload in React JS

Комментарии

  • @nayanikamukherjee7275
    @nayanikamukherjee7275 15 часов назад

    Please show how to deploy this website on vercel or any other platform

  • @shashankojha7813
    @shashankojha7813 3 дня назад

    Need svg files / assest that you have used in this project

  • @michisempaisamurai3632
    @michisempaisamurai3632 6 дней назад

    Thanks you so much

  • @gyanaranjandas3631
    @gyanaranjandas3631 6 дней назад

    Is it responsive

  • @madanmohan4916
    @madanmohan4916 8 дней назад

    Why you are not using bootstrap 5 for navbar, used navbar css.

  • @witelfortgelin5377
    @witelfortgelin5377 11 дней назад

    Hello sir! How some one can enter in contact with pls?

  • @vikustorm3411
    @vikustorm3411 12 дней назад

    Thank you so much sir, i have completed this project within 5 days

  • @manuelvaal1257
    @manuelvaal1257 14 дней назад

    The success message isn’t working on my side.

  • @manuelvaal1257
    @manuelvaal1257 14 дней назад

    Great content!

  • @AfterHan
    @AfterHan 18 дней назад

    Thank you, it is very helpful

  • @abijopaul
    @abijopaul 18 дней назад

    Github link 🥲

  • @puskar2957
    @puskar2957 18 дней назад

    1:27:16 where to get accessToken

    • @toskr-r4t
      @toskr-r4t 15 дней назад

      It's generated when you login. Use the previously created /login and the access token will be in the server response object.

  • @ErickOliverArt
    @ErickOliverArt 19 дней назад

    how can deploy this ?

  • @shivtejpisal4528
    @shivtejpisal4528 19 дней назад

    Is it just me or is anyone getting an error while connecting to MongoDB

  • @thaianhhoang5964
    @thaianhhoang5964 21 день назад

    friendly for beginner:)

  • @thala4_reason07
    @thala4_reason07 21 день назад

    how to get access_token_secret code??

  • @ritikgupta6662
    @ritikgupta6662 22 дня назад

    add voice

  • @josebaezc.7709
    @josebaezc.7709 23 дня назад

    great tutorials. Can you make a tutorial with tables? like a Point of sales.

  • @realg701
    @realg701 26 дней назад

    great video really healpful, how can i magnify even closer?

  • @IndhujaV9505
    @IndhujaV9505 28 дней назад

    Hi can I get the assets file??

  • @filmbuzz9419
    @filmbuzz9419 28 дней назад

    where get access_token_secret

  • @zeyaurrahman7765
    @zeyaurrahman7765 Месяц назад

    How to get source code

  • @pakchiechan4867
    @pakchiechan4867 Месяц назад

    2:25:02

  • @WaqarAhmed-c4k
    @WaqarAhmed-c4k Месяц назад

    can anyone share the data.js source code with images please

  • @athulkrishnavs779
    @athulkrishnavs779 Месяц назад

    Make a home page for it bro

  • @technoprime835
    @technoprime835 Месяц назад

    finally !after so many days i have completed the project. thankyou! <3

  • @shubhamrathod9249
    @shubhamrathod9249 Месяц назад

    Thank you! Project Completed.

  • @shubhamrathod9249
    @shubhamrathod9249 Месяц назад

    Unpinning the notes** const updateIsPinned = async (noteData) => { const noteId = noteData._id; const currentPinStatus = noteData.isPinned; try { const response = await axiosInstance.put("/update-ispinned/" + noteId, { isPinned: !currentPinStatus, }); if (response.data && response.data.note) { getAllNotes(); } } catch (error) { console.log(error); } };

  • @karanshah5075
    @karanshah5075 Месяц назад

    When testing in Postman, use req.user.user due to an extra layer added by JWT structure. With frontend integration, it simplifies to req.user. The access token itself is simply a random string of characters. You can add anything in access token string

    • @anilsonawane1925
      @anilsonawane1925 22 дня назад

      means in token authentication secret we can add any random string? in this project

  • @shubhamrathod8106
    @shubhamrathod8106 Месяц назад

    2:31:32

  • @tanujasharma1262
    @tanujasharma1262 Месяц назад

    bro do you use google pay

    • @tanujasharma1262
      @tanujasharma1262 Месяц назад

      I want source code but i can only pay using google pay.

  • @hri_clashofclans7105
    @hri_clashofclans7105 Месяц назад

    Hello..Can u provide assets for this project?

  • @huynhat6252
    @huynhat6252 Месяц назад

    This is awsome!

  • @nazgul4312
    @nazgul4312 Месяц назад

    Hi. First of all, I want to thank you for your work <3 I have a question: at the moment of intergration login api (somewhere 1:55:00), you don't pass it to the getUserInfo function (component Home.jsx) header with authorization What I mean: const getUserInfo = async () => { try { const response = await axiosInstance.get("/get-user", { headers: { Authorization: `Bearer ${localStorage.getItem("token")}`, }, }); //.... } Unfortunately, I get an unauthorized 401 error without the header. Everything works correctly when adding the header. but I don't see that you added it and everything works. what the problem might be?

    • @nazgul4312
      @nazgul4312 Месяц назад

      resolved :) I had a mistake onfrontend/notes-app/src/utils/axiosInstance.js

  • @tanujasharma1262
    @tanujasharma1262 Месяц назад

    hi, i want to buy source code from india, can i pay you through google pay?

  • @gamingwithgnxsahil
    @gamingwithgnxsahil Месяц назад

    Where can I find the images

  • @ĐỗLêHậu
    @ĐỗLêHậu Месяц назад

    how to geet the access token secret for env file ?

  • @NawafXRMFC
    @NawafXRMFC Месяц назад

    bro did not connect the nav links in their particular section 🥲🥲😂😂😂😂

  • @amritendunath5243
    @amritendunath5243 Месяц назад

    Where to findth the source code of it ? Please response anyone

  • @sachinjamadar4925
    @sachinjamadar4925 Месяц назад

    Login error Please enter Email! Failed to load resource: the server responded with a status of 400 (Bad Request)

  • @wanumair2719
    @wanumair2719 Месяц назад

    bro you the greatest

  • @theodavidyani6514
    @theodavidyani6514 Месяц назад

    Please explain at 1:06:25 how do you find that Access_Token_Secret? and what is mean by that?

    • @shubhamrathod9249
      @shubhamrathod9249 Месяц назад

      did you find the answer

    • @theodavidyani6514
      @theodavidyani6514 Месяц назад

      ​@@shubhamrathod9249 yes... it is no specific thing. It can be any thing. Even your name. But better it be unpredictable and strong. Cus it is for secure and effective authentication.

    • @vikustorm3411
      @vikustorm3411 14 дней назад

      you can type anything your name also. it is just a way to encode the token by using Access_Token_Secret.

    • @Goe-k5w
      @Goe-k5w 8 часов назад

      ​This is an environment variable programmers prefer to write secret_keys in environment instead of hard coding it ​@@shubhamrathod9249

  • @souvikbasak7720
    @souvikbasak7720 Месяц назад

    need help for deploying the website. Someone please tell me step by step process.

  • @mdalmamunit427
    @mdalmamunit427 Месяц назад

    Great content ❤

  • @1hpxalphaop741
    @1hpxalphaop741 2 месяца назад

    atleast please add images in the description

  • @lokesh.vervali
    @lokesh.vervali 2 месяца назад

    its very simple app brother try something unique.

  • @dieulinhnguyen4324
    @dieulinhnguyen4324 2 месяца назад

    Thank you for doing these videos. They helped me a lot with my fullstack journey. 💌

  • @cwcfunclock2709
    @cwcfunclock2709 2 месяца назад

    Where can I take those pictures?

  • @orcomon5955
    @orcomon5955 2 месяца назад

    Thank you sir 😊

  • @umutsar3611
    @umutsar3611 2 месяца назад

    Hi can you share the assets file?