Build an App using ChatGPT | No Code required

Поділитися
Вставка
  • Опубліковано 30 вер 2024

КОМЕНТАРІ • 19

  • @_junaidkhalid
    @_junaidkhalid  3 місяці тому +16

    Here's the prompt:
    Act like an experienced full-stack web developer. You have over 15 years of experience in building web applications using JavaScript, HTML, and CSS. You specialize in creating responsive and user-friendly interfaces.
    You need to create a responsive web application called "Budget Tracker". The application will help users track their income and expenses efficiently. It must be built using only JavaScript, HTML, and CSS.
    Create a Responsive User Interface:
    Design a clean and user-friendly interface.
    Ensure the layout is responsive, rendering well on a variety of devices and window or screen sizes.
    Implement Income Input Functionality:
    Allow users to input their income.
    Provide options to categorize their income into different categories like salary, freelance work, etc.
    Implement Expense Input Functionality:
    Allow users to input their expenses.
    Provide options to categorize their expenses into different categories like rent, groceries, entertainment, etc.
    Display Financial Overview:
    Display the total income, total expenses, and the balance (income - expenses).
    Data Storage:
    Store data in the browser's local storage.
    Ensure the data persists even when the user refreshes the page.
    Data Visualization:
    Implement a feature to visualize income and expenses using a pie chart or bar graph.
    Provide HTML, CSS, and JavaScript code for the entire application.
    Include comments in the code to explain each part, helping in understanding and explaining the code to others.
    Example Code Structure:
    HTML:
    Create the structure for input forms, display sections, and placeholders for charts.
    Use semantic HTML elements for better accessibility.
    CSS:
    Style the application to ensure a clean and modern look.
    Use media queries to handle different screen sizes for a responsive design.
    JavaScript:
    Write functions to handle user inputs, calculations, and data storage in local storage.
    Implement chart rendering using a suitable library like Chart.js.

  • @zwelimdlalose1059
    @zwelimdlalose1059 3 місяці тому +5

    It doesn't make sense thant no one commented on something so amazing please dont stop keep making these videos

    • @_junaidkhalid
      @_junaidkhalid  3 місяці тому +1

      thanks for the appreciation - I'll keep em coming 🙌

  • @djseber3357
    @djseber3357 2 місяці тому +1

    can I hire you

  • @DevSingh-j9y
    @DevSingh-j9y Місяць тому

    sir can we make EasySell COD Form & Upsells like application using these kinds of prompts?

    • @_junaidkhalid
      @_junaidkhalid  7 днів тому

      Absolutely - but a single prompt likely won't be enough for that.
      Btw, have a look at Composer in Cursor AI (IDE) - that can really speed things up if you just provide sufficient details about the sort of application you're looking to build.

  • @syedsubhani007
    @syedsubhani007 15 днів тому

    Nice one

  • @adeenfasihi6205
    @adeenfasihi6205 Місяць тому

    That's amazing!! Just felt my rusty brain cogs starting to move. Gotta create something good!

  • @PratikShroff-oc3qi
    @PratikShroff-oc3qi 2 місяці тому

    sir amazing video may god always keep you happy and healthy

    • @_junaidkhalid
      @_junaidkhalid  2 місяці тому

      Really appreciate the kind words - thank you, Pratik 💙

  • @hahacargoesvroomvroomskthkrrr
    @hahacargoesvroomvroomskthkrrr 2 місяці тому

    amazing sir just great you are going to become the best tech channel

    • @_junaidkhalid
      @_junaidkhalid  2 місяці тому +1

      Thanks for warm words, sir - much appreciated 💙

  • @navjotsingh2457
    @navjotsingh2457 2 місяці тому

    ty

  • @CRAZYSTORIES95
    @CRAZYSTORIES95 2 місяці тому

    Thank you