Transforming a Design into a Fully Responsive App in an Hour

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 ต.ค. 2024

ความคิดเห็น • 267

  • @konidoniravirr6580
    @konidoniravirr6580 ปีที่แล้ว +15

    A perfect channel to learn with clean editing, perfect teaching and versatility.

  • @chrismarks7495
    @chrismarks7495 ปีที่แล้ว +33

    Efficiency now just went through the roof, great tech for a scratch project. It would be greatly appreciated if you could create a video showcasing the development process of the React Native app. Your dedication and hard work are truly commendable. Keep up the amazing job!

  • @KhalidKhan-wo7xg
    @KhalidKhan-wo7xg ปีที่แล้ว +10

    I was also nominated for next ebook. Thanks for that sir. I love your community.😗😗

  • @lokeshart3340
    @lokeshart3340 ปีที่แล้ว +14

    Finnally a new video...
    Your work is just amazing brother
    And you are extemely talented
    Love from India ❤

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +4

      Love to India!

    • @lokeshart3340
      @lokeshart3340 ปีที่แล้ว

      Bro you are amazing

    • @Stefoux
      @Stefoux ปีที่แล้ว

      fortnightly content, enough to practice and remember 😎

  • @ANSHU61936
    @ANSHU61936 ปีที่แล้ว +2

    Many people don't appreciate how this can boost web development process by alot, thanks for this awesome tutorial

    • @mmadictos5356
      @mmadictos5356 ปีที่แล้ว

      It seems much slower, more cumbersome and inefficient than writing the code in the editor.

  • @billysomers-pg
    @billysomers-pg ปีที่แล้ว +2

    Thanks Adrian. Just finished my design in Figma and was looking for an AI tool. Skipped past Locofy a few times but thanks to you, I came back. Right in the nick of time.

  • @richardmasters2045
    @richardmasters2045 ปีที่แล้ว +8

    Another Masterpiece by the Master, thank you for your dedication and consistency. You are changing peoples lives all over the world!

  • @iamtrueprins
    @iamtrueprins ปีที่แล้ว +2

    Your intros are the best on TH-cam. Thanks for them!

  • @aloksrivastva4142
    @aloksrivastva4142 ปีที่แล้ว +7

    Can you make a video on " AI powered full stack development "
    It will be really beneficial to everyone and make us more efficient.
    Please do consider my suggestion

  • @guhaprasaanthnandagopal8486
    @guhaprasaanthnandagopal8486 ปีที่แล้ว +3

    Great Video Adrian, loved it. I really love your coursework, and really to say the truth, your video on creating a Covid Chart using ReactJS, back in 2020, was what that kick-started my life into the world of React -> NextJS and GatsbyJS.
    I am so eagerly waiting for your uploads on Remix, Astro or even possibly converting a React Monolith to MFEs using frameworks like Lerna, or TurboRepo or Single SPA.
    I know this is too much, and as I could not find any concrete videos on MFE(with React 18), I anticipate your videos.

  • @saqibkhanz8417
    @saqibkhanz8417 ปีที่แล้ว +2

    13 days have gone by, and I was wondering why you haven't uploaded the video yet. But it's finally here!

  • @poloff9120
    @poloff9120 ปีที่แล้ว +3

    I am waiting for this course to build new nextjs 13....i found may things in nextjs ebook...thank you.... recently i tagged in linkedin that i have build my blog application in React native by seen your React native job finder... thank you

  • @shreejairaj
    @shreejairaj 5 หลายเดือนก่อน +1

    Hi, the figma file you shared doesn't have the second page in it as shown in the video, could you please update this. Love your work! Thanks

  • @a-factoracademy
    @a-factoracademy ปีที่แล้ว +1

    Adrian, I must confess you blew up my mind with your efficiency. Please I don't mean to insult you? But, are you human or a robot? Mehnnn, I'm dazzled! Perfect content back to back and here I am with absolutely no direction since...

  • @thereaper7682
    @thereaper7682 ปีที่แล้ว +1

    Three people I like in Croatia they are Mirko Cro Cop (MMA fighter) , Antonio and Adrian. Nice vid as always

  • @vachvardanyan9234
    @vachvardanyan9234 ปีที่แล้ว +1

    The best in the World. 😍
    Thank you JSM 😍🥰🥰

  • @judevector
    @judevector ปีที่แล้ว +1

    My mentor and teacher has dropped another video , gosh how can I ever repay you ☺️

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว

      You're doing a lot just by watching and commenting 😄

  • @kabeloNkoane
    @kabeloNkoane ปีที่แล้ว +1

    mind blowing lessons, i can't wait to try all the apps from your channel after this one🤯🤯🤯

  • @younesaitdabachi7968
    @younesaitdabachi7968 ปีที่แล้ว +1

    man you are a legend on youtube keep the good work

  • @yugal8627
    @yugal8627 ปีที่แล้ว +5

    Great video, it looks so easy to do development after watching all your videos. Please also consider making a Figma design tutorial..🙏🏻🙏🏻🙏🏻 and keep it up sir.

  • @mohdarish4195
    @mohdarish4195 ปีที่แล้ว +2

    Love from India , your content is Amazing 😊

  • @DhaneshProgrammer
    @DhaneshProgrammer ปีที่แล้ว +2

    Thanks for considering my request. I'm excited for your tutorial on creating a clothing website with user functionality, Next.js, MongoDB, and Razorpay testing mode. Your expertise will greatly contribute to the growth of others. Thank you!

  • @harsh-alashi
    @harsh-alashi ปีที่แล้ว +1

    Back again with awesome tutorial. Thanks!
    Is the MERN stack course coming?

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +4

      Next.js 13 full stack course coming before :)

  • @ilnon1
    @ilnon1 ปีที่แล้ว +4

    Thanks for yet another amazing video man. I honestly don’t know how you can come up and create such videos. You seem so limitless. Nevertheless, I give you my many thanks 🙏🏽

  • @passionforlife27
    @passionforlife27 ปีที่แล้ว +2

    Love from India❤

  • @KhalidKhan-wo7xg
    @KhalidKhan-wo7xg ปีที่แล้ว +1

    Sir I waiting for your channel video project impatiencly. 💜💜 great job

  • @gerardike415
    @gerardike415 ปีที่แล้ว +1

    i remember you did a poll asking us what kinda videos we wanted and the majority vote was typescript + mern stack. please tell me they are coming?🥺 ive been waiting in anticipation ever since.

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +3

      Next.js + TypeScript is coming :)

    • @IvanRandomDude
      @IvanRandomDude ปีที่แล้ว +1

      Maybe when Vercel buys Express and MongoDB

    • @Hungryforlearning
      @Hungryforlearning ปีที่แล้ว +2

      ​@@javascriptmasteryMake E-commerce project please 🙏

  • @vickyvacky5476
    @vickyvacky5476 ปีที่แล้ว +1

    be my mentor wish i really had money to be on your online classes, love you so much🥰 from nigeria

  • @imraj9018
    @imraj9018 ปีที่แล้ว +2

    Hi, great video! Is it possible to use this tool to build a commercial application - will you own all rights to the content created?

  • @jaygaur99
    @jaygaur99 ปีที่แล้ว +1

    Up until now I really didn't think that AI is going to replace humans anytime soon but this just changed my perception. There are just a few thing remaining that needs a fronend developer's supervision otherwise...

    • @berndeveloper
      @berndeveloper ปีที่แล้ว +1

      This is used only as a basic template, the functionality is completely different, and as a modern frontend developer you need to do efficient code, dynamic components and applying clean code, this kind of tool are very useful, but you need to know what you're doing, I think is a useful tool, just as a bought template, but the business logic and client requirements are always the hard part to implement and make it tangible, this kind of tool doesn't cover that.

  • @loginet1
    @loginet1 ปีที่แล้ว +2

    That's freaking AMAZING!

  • @prosperdeogratius4888
    @prosperdeogratius4888 ปีที่แล้ว +2

    My godnes,was actually thinking of this,just few minutes ago.Thank you so much man

  • @harshkumarjha1931
    @harshkumarjha1931 ปีที่แล้ว

    Okay this is really awesome but I wanna know what kind of figma design it works with. Like is it necessary to create a totally professional figma design?

  • @thegreatben27
    @thegreatben27 ปีที่แล้ว +1

    Thanks for these Amazing courses Andrian...

  • @nayab8701
    @nayab8701 ปีที่แล้ว

    thanks for the content sir ❤ from india please keep uploading this type of content regularly

  • @realkidding1213
    @realkidding1213 ปีที่แล้ว +2

    Please make a short video about, why we need to use Typescript 😅

  • @FuzzyAnkles
    @FuzzyAnkles ปีที่แล้ว +1

    you bro are amazing! every project is just out of this world! keep going!

  • @trialbyfire1108
    @trialbyfire1108 ปีที่แล้ว +1

    Woow...Another amazing course tutorial from this Channel..i jus love this guy......Everyone commenting hope y'all subscribed to this amazing content....and recommend others to do so not to miss out on this...

  • @Kokouvi_el_mejor
    @Kokouvi_el_mejor ปีที่แล้ว +1

    🎉 ADRIAN, A SAVIOR

  • @webshipon1941
    @webshipon1941 ปีที่แล้ว

    josss sir

  • @bornclasher1294
    @bornclasher1294 ปีที่แล้ว

    Amazing revolution. AI never replace developer, it supports developer!
    Am I right?

  • @SiaDavarnia
    @SiaDavarnia ปีที่แล้ว

    Amazing videos... Thank you for always being so up to date...

  • @meheraabarvy4134
    @meheraabarvy4134 ปีที่แล้ว

    Another project and some new strategy!

  • @muhammadhaseeb6467
    @muhammadhaseeb6467 ปีที่แล้ว

    Not following any other tutorials of next js from weeks here we go thanks Adrian brother

  • @Pablo_JRE
    @Pablo_JRE ปีที่แล้ว +4

    Great video like always!! keep it up. I would love to see some more vue videos in the future

  • @kunalss9314
    @kunalss9314 ปีที่แล้ว +1

    I cannot thank you enough in words

  • @mbilal025
    @mbilal025 ปีที่แล้ว +1

    Great Video, please make a video Airbnb clone with nextjs and typescript if you can, it would be great.❤ Thank you for your dedication and consistency.

  • @juan83xd
    @juan83xd ปีที่แล้ว +1

    What?! This is the future!

  • @vinayyouth7914
    @vinayyouth7914 ปีที่แล้ว +1

    Request:This time we want a project on combination of blockchain and AI

  • @6.squash.936
    @6.squash.936 ปีที่แล้ว +1

    Return of the King

  • @johnsondsouza4722
    @johnsondsouza4722 ปีที่แล้ว +2

    its not the latest version of nextjs and i think this would be more helpfull in making some complex ui components faster rather than a whole web app great tool

  • @koen.mortier_fitchen
    @koen.mortier_fitchen ปีที่แล้ว

    Thank you for your work, Sir. I loved it!

  • @alipasha7275
    @alipasha7275 ปีที่แล้ว

    Do you use this tool for rest of videos in channel?

  • @doob4611
    @doob4611 ปีที่แล้ว

    Thanks Adrian! Would you mind sharing the repo for this, please?

  • @Yesterday_i_ate_rat
    @Yesterday_i_ate_rat ปีที่แล้ว +1

    You are legend sir , thank you 😘💛

  • @iDivici
    @iDivici ปีที่แล้ว

    Niiiice! I didn’t know about these Ai tools until recently. Have you tried Bifrost before?

    • @designforge_studio
      @designforge_studio ปีที่แล้ว

      Nice where's is the art in programming thank you for destroying my future ai

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +1

      AI will only make developers more efficient! :)

    • @iDivici
      @iDivici ปีที่แล้ว

      Very true! It only helps get more work done in less time

  • @husnamert477
    @husnamert477 ปีที่แล้ว +1

    on figma everthing is normal but when i click preview in this screen button size changes and incompatible with each other why is this happening?

  • @icecube9430
    @icecube9430 ปีที่แล้ว

    Pls can u now do a figma web design tutorial? maybe using ai if it makes it faster/easier, so that it can be more complete

  • @MegaCh7
    @MegaCh7 ปีที่แล้ว

    Hey, thanks for the video!
    Just wondering, can you get different API KEY for CarHUb? The current one does not work.

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว

      You can get a new one by following the link in the description :)

  • @jawadkhan1907
    @jawadkhan1907 ปีที่แล้ว +3

    I clicked the video 10x faster

  • @muhammadatif-dk4tx
    @muhammadatif-dk4tx ปีที่แล้ว

    Awsome video very helpful

  • @shabazshaikh8370
    @shabazshaikh8370 ปีที่แล้ว

    what to add as company url when signing up for locofy. I'm not on a job or have any portfolio website

  • @systechadmin8368
    @systechadmin8368 ปีที่แล้ว

    Will it can be integrated with Visual Studio 2022 ?

  • @Alaz21
    @Alaz21 ปีที่แล้ว +1

    Thanks for all Adrian , For ur next course please can you make Ai based human image to animation changer ..Please ...❤

  • @jananis4536
    @jananis4536 ปีที่แล้ว

    plz post a video about any educational react app using locofy using sanity (like online course learning , college ) .. or design any mern or mean stack realtime applications using locofy . ( responsive ). is it possible design an app using locofy plugin in figma and design them in andriod studio.??

  • @misbahsiddiqui9365
    @misbahsiddiqui9365 ปีที่แล้ว

    Thank you sir you are great

  • @razzaqmohammedali4653
    @razzaqmohammedali4653 ปีที่แล้ว +1

    Who actually taking the world Mr Adrian or JavaScript 🤔🤔

  • @lea0o0oo
    @lea0o0oo ปีที่แล้ว

    I bet that the part at 2:25 is stolen from Fireship 🤣
    Great video anyways👍

  • @mmadictos5356
    @mmadictos5356 ปีที่แล้ว +1

    I really don't understand why all the low code tools come to propose the same thing as wordpress. And that is to design in the most cumbersome way possible by clicking 50 options for something that you can do in a few lines of code. If this video started with a blank canvas it would last 5 hours.

  • @healthyIntimacyTips
    @healthyIntimacyTips ปีที่แล้ว

    this is the best AI tool so sar made by pakistanis ❤

  • @LearnwithRupam
    @LearnwithRupam ปีที่แล้ว

    What are the tools you use to make such beautiful pdf

  • @DJ_Melech
    @DJ_Melech ปีที่แล้ว +1

    Did anyone find that when they went to export and sync to Github that it missed the landing-page.js? I only have the _app.js page 😕

  • @ahmadsaadkhan
    @ahmadsaadkhan ปีที่แล้ว +1

    @Adrian waiting for a Memories like project with more advanced features with frontend and backend in typescript with Next.

  • @malikazharabbas5898
    @malikazharabbas5898 ปีที่แล้ว +1

    Please make a video for theme settings of mui in react js. With dark and light mode.

  • @saipranav434
    @saipranav434 ปีที่แล้ว

    broo i learned react js , react native and next js . but now after seeing this i got doubt will figma affect web developers ?? . because it is producing code from design . letss see it ....

  • @BrainyiFY_o0
    @BrainyiFY_o0 ปีที่แล้ว

    Hii i was creating a web 3.0 project watching your tutorial but I am not getting the exact output the same as yours. Can you please update the code

  • @irabor18
    @irabor18 ปีที่แล้ว

    This AI extension is not working properly anymore. It will not recognize the 2nd page component for me no matter what I. Just an FYI. AI still has a ways to go, nice vid!

  • @slb8888
    @slb8888 ปีที่แล้ว

    Hi there could me tell me which version of vscode is used in this project

  • @Alpha-ou1ks
    @Alpha-ou1ks 5 หลายเดือนก่อน

    can you please add more videos using locofy?

  • @soulslord1733
    @soulslord1733 ปีที่แล้ว

    did you know why at 55:00 const result = await client.from("properties").select("*") return me an empty array?

  • @sang4005
    @sang4005 ปีที่แล้ว +1

    Good job ❤ another one

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +1

      Thank you! Cheers!

    • @sang4005
      @sang4005 ปีที่แล้ว

      Build a React project for supervising student projects can be a beneficial and efficient way to manage and track the progress of students' work without the paper work.

  • @realkidding1213
    @realkidding1213 ปีที่แล้ว +1

    You expected 1M subscribers at least.

  • @PrinceDalsaniyaYT
    @PrinceDalsaniyaYT ปีที่แล้ว

    I really wanna know what is that tool at 0:54 you are using for testing responsiveness. I tried finding, no success. Please let me know if anybody knows.

  • @dxcodingweb
    @dxcodingweb ปีที่แล้ว +1

    This is Lovely 🎉

  • @slb8888
    @slb8888 ปีที่แล้ว

    my vscode and your Vscode is different could you tell me which vscode you are using I am using Vscode 1.80 version in windows in hp laptop

    • @slb8888
      @slb8888 ปีที่แล้ว

      Please answer

    • @slb8888
      @slb8888 ปีที่แล้ว

      In my VScode GIT is not present and some other features that are present in your vscode as shown in this project

    • @slb8888
      @slb8888 ปีที่แล้ว

      37:22 here you can see at left corner .git is present but it is not visible in my VScode

    • @slb8888
      @slb8888 ปีที่แล้ว

      Are you using VScode in mac

    • @slb8888
      @slb8888 ปีที่แล้ว

      Please answer

  • @itskrish0196
    @itskrish0196 ปีที่แล้ว +2

    Amazing

  • @berndeveloper
    @berndeveloper ปีที่แล้ว

    The only good use case that I see to apply this, is to design components (1 by 1), then extract the code and copy/paste each component into a created project made with React etc, like building legos, otherwise you will get tons of boilerplate code into your project. Doing a complete project from scratch with this technology is like a pain in the *ss if you ask me, I don't like it. Thanks for the video, this will be so helpful anyways!.

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +4

      Did you check it out? The generated code for the full app is actually pretty close to what a real developer would write.

    • @spaceshipdev
      @spaceshipdev 9 หลายเดือนก่อน

      ​@@javascriptmasteryI agree, it does come close for sure, especially when using Tailwind, though I think what bernhardsilva is saying is; he prefers to use this for additions to a site, not build a site from scratch.
      I'm the same actually. I think this tool absolutely has a future, but learning Locofy on top of the already many awesome frameworks out there should not be the priority or mistaken for a tool to base a business off.
      I'd wait for it to leave beta and for them to reveal actual pricing before getting into this.
      I saw this video and watched it half way through before realizing, wait. This is not something I can rely on yet, invest time into it IF it gets released.
      That said though, I AM a fan of this channel and intend to proceed with you're other content!
      4 sites in 10 hours has my attention.

  • @alho4279
    @alho4279 ปีที่แล้ว

    possible to let locofy to generate Appdir way instead of pages way?

  • @xade8381
    @xade8381 ปีที่แล้ว +1

    thanks a lot for sharing.
    Hope it remains free, maybe with some limitations

  • @Ranveer_Soni
    @Ranveer_Soni ปีที่แล้ว

    Hey JSM, can you make a video on Discord Bot List ily you're video tho

  • @debugpro
    @debugpro ปีที่แล้ว

    can you pls tell me which file icon theme you are using in vs code

  • @joel9909
    @joel9909 ปีที่แล้ว

    Should this be scary, or I should just chill out and enjoy the ride?
    I think it's time to start considering a switch to CySec.

    • @javascriptmastery
      @javascriptmastery  ปีที่แล้ว +1

      Chill out and enjoy the ride! 😊

    • @IvanRandomDude
      @IvanRandomDude ปีที่แล้ว

      what makes you think CySec is better lol

    • @joel9909
      @joel9909 ปีที่แล้ว

      @@IvanRandomDude web has been too perforated with these tools and we all know that networking and security, on the other hand, is a different kind of animal.

  • @christian-schubert
    @christian-schubert ปีที่แล้ว

    Telling AI to translate natural language or designs into framework code that is then turned into Javascript is a bit like booking a flight from London to Paris with a layover in Hawaii.
    A framework's foremost task is to facilitate writing code in the first place, an issue largely mitigated by AI. In many cases, this comes at the expense of speed and/or data/file size.
    Now, if you're working in a large team and have to use certain frameworks, this approach of course seems legit.
    However, when working on a smaller project (whatever that might be), relying on frameworks in conjunction with AI is becoming increasingly bizarre...

  • @mohammadahmadian-f1m
    @mohammadahmadian-f1m ปีที่แล้ว

    you are perfect

  • @mxtty2415
    @mxtty2415 ปีที่แล้ว

    Which vscode theme do u use?

  • @neilkumar3626
    @neilkumar3626 ปีที่แล้ว

    thanks babe..

  • @rafiullahwaseem7209
    @rafiullahwaseem7209 ปีที่แล้ว

    Please make projects videos using VueJS.

  • @losmandev
    @losmandev ปีที่แล้ว

    What website was that used to see all mobile responsive modes?

  • @syed_faraz_hussain2884
    @syed_faraz_hussain2884 ปีที่แล้ว +1

    Thats something i was looking for

  • @bossgd100
    @bossgd100 ปีที่แล้ว

    Where can I find figma design of différents website ?
    Différents design library