One Day Builds: Instagram Clone Using Flutter

Поделиться
HTML-код
  • Опубликовано: 2 ноя 2024

Комментарии • 328

  • @manuele.espinal1130
    @manuele.espinal1130 5 лет назад +144

    Hey Kalle, you should do a video about good practices when coding in fluttter, or maybe just things you like to do in a certain manner when coding

    • @Hallden_
      @Hallden_  5 лет назад +15

      Yeah that's a great idea, although I don't think I follow many of the conventions in flutter 😬😬

    • @macdonalds6039
      @macdonalds6039 5 лет назад +1

      That's just a linter..

  • @patelsameer529
    @patelsameer529 5 лет назад +62

    Make a full tutorial on how to make this

  • @lerdi
    @lerdi 4 года назад +21

    2:03 This is how Instagram came to be if you've ever wondered

  • @williamkyorazo3521
    @williamkyorazo3521 5 лет назад +11

    I'm studying flutter now, and dart it's a delicious language, very similar to Java..
    i'm enjoying!

    • @Hallden_
      @Hallden_  5 лет назад

      Glad to hear it! :)

  • @einnorw
    @einnorw 5 лет назад +12

    i can't imagine how frustrating this process was, but you pulled through which is awesome

    • @Hallden_
      @Hallden_  5 лет назад +6

      Thank you!
      Yeah it was incredibly frustrating, and a real test
      The third time I was dead tired and ready to give up

  • @firdeusx
    @firdeusx 5 лет назад +8

    Commenting on your code makes it easier and simple

  • @borisllonalonso99
    @borisllonalonso99 5 лет назад +5

    One day builds are so inspiring, continue like that!

    • @Hallden_
      @Hallden_  5 лет назад +1

      That's great to hear man! I will continue with them, really cool to hear that they inspire you :)

  • @gerhenry7127
    @gerhenry7127 5 лет назад +24

    Kalle: "Ive been filming for 5 and half hours and im going to start over and i havent eaten" - this is the difference between hard work and getting things done versus procrastinating and being lazy

    • @Hallden_
      @Hallden_  5 лет назад +3

      Haha thanks man! It was a struggle for sure and also tested my patience like crazy 😆

  • @dancamdev
    @dancamdev 5 лет назад +4

    Nice job with this build! you might want to check out the SafeArea widget instead of using padding to move up the Navigation bar, just wrap the whole UI with the SafeArea widget and you’re good to go

    • @Hallden_
      @Hallden_  5 лет назад +1

      Thank you!
      Oh yeah a few people have mentioned that haha
      Good advice, I appreciate it! :)

  • @anthoxel
    @anthoxel 5 лет назад +10

    you're gonna be the first one im watching on twich obviously... bring up the Flutter!

  • @muntder1435
    @muntder1435 5 лет назад +21

    man, I am facing a serious problem with the notifications!
    I've just realised that you have posted two videos before this one !!!

    • @Hallden_
      @Hallden_  5 лет назад +1

      Hahah okay that's no good man😆
      Don't want to miss these incredible videos haha 😉

  • @salamfarmandehnanautaoffic6355
    @salamfarmandehnanautaoffic6355 2 года назад

    I love you kalle you are so great!

  • @mahditalebi1770
    @mahditalebi1770 5 лет назад +2

    this was really great to watch it all come together.
    you got yourself a new sub dude

  • @adamtak3128
    @adamtak3128 5 лет назад +31

    If you need the outline material Icons, you can sue this package - outline_material_icons: ^0.1.0

  • @toatsbarley
    @toatsbarley 5 лет назад +3

    Nice job! You might want to look into the SafeArea widget instead of manually padding the bottom navbar.

    • @Hallden_
      @Hallden_  5 лет назад

      Okay nice! Thank you, I will check it out :)

  • @eduardopina7964
    @eduardopina7964 5 лет назад +2

    Impressive, achieving that in one single day.

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you man, I appreciate it! :)

  • @adjuvara
    @adjuvara 5 лет назад +27

    Given your Sports background maybe do a MyFitnessPal clone in the future :D

    • @Hallden_
      @Hallden_  5 лет назад +6

      Yeah that's a good idea!
      That might have to be the next one day build Flutter video that I do! :)

  • @theo1680
    @theo1680 5 лет назад

    these types of videos are pure gold ! Thanks 👍🏻

    • @Hallden_
      @Hallden_  5 лет назад +1

      That's awesome to hear that you think so, I really appreciate it so thank you :)

  • @Karinnederland
    @Karinnederland 2 года назад

    What courses you recommend to learn dart and Flutter? Or Java development:)

  • @abhishekgovekar5542
    @abhishekgovekar5542 4 года назад

    Great!! It really helped me. Thank you for the video Kalle

  • @mayraamaral7267
    @mayraamaral7267 5 лет назад +1

    Awesome quality as always!

    • @Hallden_
      @Hallden_  5 лет назад

      Awesome support as always! :)

  • @SydarLM
    @SydarLM 4 года назад

    Kalle, like your computing system.

  • @xiaoshou6752
    @xiaoshou6752 5 лет назад +2

    Really nice video as always, keep it up!
    Something that slightly bothered me however: maybe it might be an idea to cut the left part of your webcam which doesn't really show something important out, as it's blocking the top right of your VSCode.
    Other than that, a pleasure to watch!

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you man! I really appreciate that sort of feedback, I will change that for sure :)

  • @abdurrehmankhalid2290
    @abdurrehmankhalid2290 5 лет назад +3

    I was looking to learn something during these summer vacations and i came at your video and it looks pretty cool building you a very famous application. I think I should add Dark and Flutter in my learning list as well. I am currently working on the Java Full Stack Development which includes Java Spring MVC, Spring Boot, Hibernate and Angular 7.

    • @goth14wx47
      @goth14wx47 5 лет назад +2

      Well Java it's good for get a job, but it would be better that you put some attention to the new technologies, good luck.

    • @abdurrehmankhalid2290
      @abdurrehmankhalid2290 5 лет назад

      @@goth14wx47 Yes Sir, Currently Working On Angular 7 Which is Modern JavaScript Framework and it is very useful in building Enterprise Level Web Applications, As We all know that Node.Js cannot handle a huge amount of data that is being sent from the server side so in this Java is Great.

  • @mariemlachker3218
    @mariemlachker3218 4 года назад

    It's an amaizing job 👌👍

  • @gausoft
    @gausoft 4 года назад

    Thanks!! I would like to know if we are not likely to be prosecuted if we made apps clone for learning purposes

  • @msinfo32
    @msinfo32 5 лет назад

    this looks much better than instagram

  • @hamdanshafiq4403
    @hamdanshafiq4403 3 года назад

    I just come here for the satisfaction of watching someone code
    well....I cant code my myself

  • @YT-ld2fl
    @YT-ld2fl 2 года назад

    Hi Kalle, do you have other videos explain how data is saved in the background?

  • @shavar67
    @shavar67 5 лет назад +1

    I’ve also cloned Instagram just the homepage and the like button functionality but i used a listview builder, also you should give the like button a splash color when it’s clicked :p

    • @Hallden_
      @Hallden_  5 лет назад +1

      Nice man!
      Yes I agree :)

  • @simonhaas1243
    @simonhaas1243 5 лет назад

    Nice to have an Instagram UI. But how do you actually connect it with a backend server now? This is something I still struggle to understand with flutter. A 'One Day Build: Instagram Backend' would be nice.
    This might be a different question but how do you build an app which can be used completely offline and has the functionality to sync to a server when connected with the internet?

  • @ramayani-12
    @ramayani-12 5 лет назад

    Your eork is just amazing. Genuinely loving ur videos keep it up

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you for that, I truly appreciate it! :)

  • @pradeepkumarhitz
    @pradeepkumarhitz 5 лет назад +5

    I love to study web application development, what are the programming skills I needed to create an application?

    • @microcosm2377
      @microcosm2377 5 лет назад +3

      a good front-end toolkit: CSS, HTML, Javascript, jQuery (along with a framework like Vue.js, Angular, or React). If you intend to do anything like user authentication, blogs, forums, etc, I would recommend some back-end like: SQL, MongoDB, and a decent language like Ruby on Rails, Python, or Node.js.
      Sorry if this doesn't answer your question.

    • @deistormmods
      @deistormmods 4 года назад +1

      @@microcosm2377 Would you recommend Firebase for authentication?

  • @xugxug5277
    @xugxug5277 5 лет назад

    Nice Job

  • @esmul
    @esmul 4 года назад

    Love your videos man, been doing Flutter myself after taking the Udemy course on it.
    Had a question for you though: do you ever get distracted during a programming session? Like on this one day build, you said you went from 9am to 9pm, do you ever quit for a couple hours and come back?
    When I code, I feel like I get easily distracted and can only code for like a hour before my attention goes elsewhere, like I have ADD or something. So I plan on spending 8 hours on something, and end up coding for only 3 hours. Do you ever deal with that? And if so, what have you done to mitigate that?

  • @origindunya
    @origindunya 3 года назад

    Would you recommend to use dart for creating fang type apps or would you rather go with native apps, react native or python ?

  • @MrPherez
    @MrPherez 4 года назад

    The course is good, for purpose of sharing and learning you should try do a slow tutorial or give an option for the same.

  • @gaxkiller
    @gaxkiller 5 лет назад

    4:30 use MediaQuery.of(context).padding.bottom as the margin value so if you are on a device without bottom bar (aka not iphone X) you don't have randomly big marging

  • @yurvan
    @yurvan 4 года назад +1

    In Flutter Is it possible to show the image and the video in the same widget, Are there any common widget?

  • @laurinnoelfrank6312
    @laurinnoelfrank6312 5 лет назад

    real cool project, keep up the good work

  • @T1ger8oi
    @T1ger8oi 4 года назад

    Hey Kalle, do you know how to use Amazon Amplify? How long would it take you to build an Instagram clone using serverless computing?

  • @matthcw8745
    @matthcw8745 5 лет назад +1

    Sweet!

  • @rebarius
    @rebarius 5 лет назад +1

    Maybe you'll add the like-animation to the favorite iconbutton :)

    • @KayoleKnight
      @KayoleKnight 5 лет назад

      i'd love to see this.....or even the "typing"

  • @yogeshingole8842
    @yogeshingole8842 3 года назад

    Hi brother I like your video I am beginniner I want to become like you so how I start which programing language should I have to learn and where I learn free

  • @azemajroski7720
    @azemajroski7720 5 лет назад +1

    Great and inspiring video bro respect

    • @Hallden_
      @Hallden_  5 лет назад +1

      Cool to hear that you found it inspirational! Thank you :)

  • @prashantindurkar
    @prashantindurkar 5 лет назад +1

    you are great Bro...

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you, you too...

  • @omaryousifkamal4290
    @omaryousifkamal4290 4 года назад

    great

  • @DuckFace31
    @DuckFace31 5 лет назад +4

    streaming on twitch would be awesome 👌🏼

    • @Hallden_
      @Hallden_  5 лет назад

      Glad you think so! It's coming as soon as I can get it set up :)

  • @جياالحق
    @جياالحق 4 года назад +1

    God Bless you

  • @hft3004
    @hft3004 5 лет назад

    Hi Kalle Hallden ,i am new to flutter.May i ask you a question please?
    How to solve two appbar in one page? At scene 14:16 you are using 'return container' to replace Scaffold to achieve the goal
    but when you said want to handle back button issues, at scene 14:32 you are using 'return Scaffold '.
    Thanks.
    Btw i love your flutter video and keep going!

  • @Andrew-pz8jx
    @Andrew-pz8jx 5 лет назад +2

    I am so amazed by your knowledge! I've been learning Python and maybe someday get to this level.. Nice vid.

    • @Hallden_
      @Hallden_  5 лет назад +1

      Thank you, but the videos might make me look better than I am because it's not really that difficult I promise :)

    • @Andrew-pz8jx
      @Andrew-pz8jx 5 лет назад

      Kalle Hallden love it!! Thank you for being super supportive. Watching you do these builds is great to push me further...kudos✌️

  • @blackknight7963
    @blackknight7963 4 года назад

    Should we learn java and android studio for Android app dev or flutter and dart what you'll suggest?

    • @ayxxshhh
      @ayxxshhh 4 года назад +1

      If you just wanna make apps for Android then you can learn java but if you wanna make apps both for android and iOS flutter is way to go 👁️👄👁️

  • @marioskadriu441
    @marioskadriu441 5 лет назад +6

    Great video as always I like this type of videos. When Livestreams will begin ?

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you, really appreciate it!
      I am working on the livestream setup to get everything working and now I pretty much only have to learn how to work with the streaming software and how twitch livestreaming works and then I can start. It won't be long if everything goes according to plan I am hoping to do my first one next Sunday (23rd) but no guarantees. Everything tends to always take longer than planned.
      But that's at least a rough idea :)

  • @keexotics3849
    @keexotics3849 3 года назад

    is it possible to upload your website or a site like this on the appstore or is there another program specific for this

  • @cuong1112035
    @cuong1112035 4 года назад

    please make a video to share about how to create and open a flutter project with VS or Android Studio using terminal

  • @mockingbird3809
    @mockingbird3809 5 лет назад

    Cool Kalle That's Cool Idea.

  • @veronicagilbert5592
    @veronicagilbert5592 5 лет назад

    Hey Kalle Hallden, thanks for the video... it was very useful. But people who are interested in starting a business, try out a clone of popular websites/apps. For example, UberEats Clone App, BlaBlaCar Clone App, Airbnb Clone App, Instagram Clone App, etc.

  • @MihaiMangu8
    @MihaiMangu8 4 года назад

    What instagram api were you using? Now there are multiple

  • @dirisleabdi364
    @dirisleabdi364 5 лет назад +8

    ❤️Flutter Ilove ❤️

  • @fish00p
    @fish00p 4 года назад

    Hey, i saw on google that, to make an app like instagram will take 4-6 months. How did you `do it in just a day

  • @it46vistargupta19
    @it46vistargupta19 2 года назад

    When did you implemented ig api or firebase

  • @mdtanvirhasanjabir1759
    @mdtanvirhasanjabir1759 4 года назад

    Bro can you please make the Facebook clone.
    And one thing ,
    I really enjoying your video.
    Thanks bro.

  • @adamhurwitz
    @adamhurwitz 5 лет назад

    If you were to implement a media player for your Instagram app, ie ExoPlayer on Android, which library would you use for Flutter or would you build out a native solution for iOS and Android then bridge the two together?

  • @lilqero2252
    @lilqero2252 2 года назад

    Hi all, does anyone know how to run your flutter demo on your mobile phone as Kalle did? Is there something like expo for flutter?

  • @urosisakovic7711
    @urosisakovic7711 5 лет назад

    For icons in the future u could use font awesome i use it on almost every project where i have to deal with that type of stuff. Nice video my man :)

    • @Hallden_
      @Hallden_  5 лет назад

      Okay yeah I will check it out!
      Thank you :)

  • @saratiko
    @saratiko 4 года назад +1

    Would this app work on all platforms for multiple users? I didnt notice any database nor something similar to a database to actually store posts etc. How do you manage that?

    • @mohilsheth611
      @mohilsheth611 4 года назад

      Jim Sundqvist you’ve to understand this is more complex than how it’s shown on this video. Instagram isn’t stupid to have 100s developers working when there’s only one needed. This is just a good start, but in real it needs a lot more complex architecture to build an app like Instagram. Just appreciate this guys effort and move on.

    • @saratiko
      @saratiko 4 года назад

      Mohil Sheth yeah I understand something else is going on and I saw Firebase is an alternative to use as a backend for flutter, which I believe I might end up using when I finish my app and actually come up with the proper idea I want to build, currently just trying to learn the language

  • @KaranKumar-pt7uu
    @KaranKumar-pt7uu 5 лет назад

    If I want to make app like tiktok. How much time does it take.can u please tell me brother & how much money u need

  • @Alex-kg1xh
    @Alex-kg1xh 5 лет назад +2

    I guess you will spend much time for Stories/Streaming (webrtc, maybe custom protocols) implementation, adding cache storage, image filters (speed up by Render Script, Metal/OpenGL) ... a lot of work.
    But Instagram UI is quite simple and easy to implement.

  • @daxdax89
    @daxdax89 5 лет назад

    Nice video. Keep making flutter videos!

    • @Hallden_
      @Hallden_  5 лет назад

      Thank you, I will for sure! :)

  • @24YOUNG.
    @24YOUNG. 4 года назад

    I have some question sir, we need install android studio too? If we used flutter for making the apps?

  • @joshuabellchambers2228
    @joshuabellchambers2228 3 года назад

    Hey Kalle, how do you get the iphone side by side on your desktop to see changes while coding?

  • @shashidharreddy1624
    @shashidharreddy1624 5 лет назад

    for full-fledged android app development with flutter which is best, VScode or android studio ?

    • @shashidharreddy1624
      @shashidharreddy1624 5 лет назад

      @KingTomasu Thanks for the reply, my system is windows 10 Pentium g2020 8GB ram. can I do android studio app development with flutter?

  • @alloo12dal
    @alloo12dal 5 лет назад

    Wow this is so amazing how fast you can build apps with flutter! I really need to learn this for rapid development! Any tips on where / how I can learn?

    • @Hallden_
      @Hallden_  5 лет назад +1

      Haha thank you!
      Yeah I would suggest searching RUclips for 'UI design Flutter' and that should get you started :)

    • @alloo12dal
      @alloo12dal 5 лет назад

      Kalle Hallden awesome!! Will get started ASAP!

  • @Timeside..
    @Timeside.. 5 лет назад

    im in my last year of computer science but i know like no single code-line im so disappointed i feel awful i wish i could be like this guy he looks to be so good and on point when he said at your job test you will be given problems to solve i felt like dying from inside like a hole in my chest please ''any advice dear programmers'' out there.

  • @BigerBoy
    @BigerBoy 5 лет назад +2

    🔥

  • @tubbylardman
    @tubbylardman 5 лет назад

    Can I ask why you used a margin, for the bottom navbar, as opposed to SafeArea? The set up you have would be fine for an X/Xs/Xr but would be jarring for rectangle phones.

    • @Hallden_
      @Hallden_  5 лет назад +1

      Didn't know about SafeArea 😬😆

  • @sandeeppandey6493
    @sandeeppandey6493 5 лет назад

    Hey Kalle I liked it. But can you tell me what type of Programming language you used to make it a clone of Instagram. Reply Please. 🙂🙂🙂

  • @Atameow
    @Atameow 5 лет назад +17

    wow music is way 2 loud compared to voice... gota adjust every time u start coding..nty

    • @Hallden_
      @Hallden_  5 лет назад +1

      Sorry about that! Will fix for upcoming videos for sure :)

  • @stylomojo
    @stylomojo 5 лет назад

    Does the syntax the same as python? I usedto learn html and hope this flutter is easiest to learn

  • @rixtacarde7333
    @rixtacarde7333 5 лет назад +1

    Did you create an alias for the command create to make a new github repo, readme file, and push and commit as well as open those files in vs code??

    • @Hallden_
      @Hallden_  5 лет назад +1

      Yes in my video 'automatin my projects with python' :)

  • @emmanuelogbewe2334
    @emmanuelogbewe2334 5 лет назад

    Great vid!!

  • @abulbasharkhanrakib3591
    @abulbasharkhanrakib3591 5 лет назад

    Great work bro😍

  • @romanortynskyi
    @romanortynskyi 4 года назад

    what about navigation? on android when I press back button I want to go to the previous bottom navigation bar tab and when some post is opened I should go back to list of posts

  • @CanalDoFabinho
    @CanalDoFabinho 2 года назад

    Hey man, I've sent you an email asking if I could use this app in one of my videos? Messaging here too in case it got lost in the spam folder :)
    Thanks for the video, it's amazing!

  • @joedavies6624
    @joedavies6624 4 года назад

    Hey @kalle, what's the app called you use to code with who h has two screens?

  • @ekamahendra1061
    @ekamahendra1061 5 лет назад +3

    Amazing your app , i want to be like you.

    • @app11120
      @app11120 5 лет назад +2

      Everyone can be a programmer. Good luck

    • @ekamahendra1061
      @ekamahendra1061 5 лет назад

      @@app11120 I need friend for learn programmer 😥

    • @Hallden_
      @Hallden_  5 лет назад +3

      Thank you, and I want to be like you :)

  • @leightonchen9381
    @leightonchen9381 5 лет назад

    Flutter is the future.

  • @ishanksharma9051
    @ishanksharma9051 5 лет назад +1

    Hey can you increase the font size for your future vids, amazing video btw

  • @husyn7120
    @husyn7120 4 года назад

    can i use django on backend for mobile apps

  • @DelliumM8
    @DelliumM8 5 лет назад +2

    You should stream here on RUclips instead of Twitch, all your fan base is on this platform.

    • @Hallden_
      @Hallden_  5 лет назад +1

      My plan right now is to stream on twitch and then upload it to RUclips as some sort of long form coding session :)

  • @jacobgasser3093
    @jacobgasser3093 5 лет назад

    I would love some Flutter tutorials, i am kind of terrible at it haha

    • @Hallden_
      @Hallden_  5 лет назад +1

      A lot of people are asking for that, but I am not really good at building according to the convention or using best practices so I just feel like if I did tutorials I would either have to study up and spend a ton of extra time learning the best practices. Or I would be teaching things that may end up leading you down a wrong path haha

    • @jacobgasser3093
      @jacobgasser3093 5 лет назад

      @@Hallden_ I don't mind bad practices ;)

  • @alphamale6810
    @alphamale6810 5 лет назад +1

    Is flutter ready to make a fully functional app and publish it ?

    • @fjord-4511
      @fjord-4511 5 лет назад

      wall maria if you check out the RUclips channel for flutter they showcase a few good apps that have been made, and from what I can tell, it’s definitely plausible to make a full functioning app with it

    • @Hallden_
      @Hallden_  5 лет назад +1

      Yes for sure :)

  • @devislakkad9855
    @devislakkad9855 3 года назад

    What is your using opreting sistem

  • @praveenapoojary8031
    @praveenapoojary8031 5 лет назад +5

    Use whole content inside a widget called "SafeArea" instead of struggling with margins. Good work though. Keep it up.

    • @Hallden_
      @Hallden_  5 лет назад +1

      Yes will look into it :)

  • @JamesKooper
    @JamesKooper 5 лет назад

    Great content

  • @taimoorahmad2510
    @taimoorahmad2510 3 года назад

    Would you be able to clone Tinder?

  • @ranaaamer3849
    @ranaaamer3849 5 лет назад +1

    which tool you use for recording video and yourself

  • @chethiyairoshana5402
    @chethiyairoshana5402 5 лет назад +1

    Nailed it bro :D :D :D :D :D

  • @goth14wx47
    @goth14wx47 5 лет назад +1

    I like flutter ,I have been playing with it, but in Linux with lxde and even with the lighter desktop environment, Its laggy a lot, so I have to buy another pc for flutter

    • @spiderous
      @spiderous 5 лет назад

      I've got Linux Mint and it's working perfectly for me

  • @RoqueMarcelo
    @RoqueMarcelo 5 лет назад

    Subscribed!