How to build an Instagram CLONE in Bubble - Flexbox - Bubble tutorial (Part 1)

[@BuildAppsWithoutCode]

Thanks for watching! Don't forget to grab the link to this exact Bubble app so you can see exactly how we built it. Get it here www.buildappswithoutcode.com/instagramclone

[@Rahul_bhusan]

Hats off to your teaching skills

[@tmmerlo]

Fantastic video. One of my favorite bubble tutorials I have ever seen (and I've watched a LOT of them). Thank you.

[@jacksondanielles3347]

Probably wouldnt have figured bubble out without ur tutorials! Wonderful teacher, thank you 😊 💗

[@BuildAppsWithoutCode]

Thank you! More to come! 🙌🏻

[@xDwTz]

Appreciate your humour, good tutorial!

[@Orangez2z]

That's an awesome video! Liked it very much. Waiting for the second part. Thanks~

[@BuildAppsWithoutCode]

Thanks for watching! Part 2 coming soon!

[@Riolamusicsession]

Hello great teach I love your tutorial so much best ever, pls help me with a video how to make current user view other user profile from the home page or from any page the current user is

[@djovaynedelacroix306]

Hello, incredible video ! But there is something I don't get. At 12:07, when you create images, I don't see you uploading any images and yet when you go to preview, you have images of several dogs. Can you help me with this ? I tries to upload images but I can only upload one ... Thank you !

[@rhkina]

Great tutorial! Thank you!

[@BuildAppsWithoutCode]

You're very welcome Rubens!

[@MotorcyclesandArt]

Thank you. Great video.

[@BuildAppsWithoutCode]

Glad you enjoyed it! 🙌🏻

[@simon.stjohn]

Hey Jason...Awesome video...I like your pace...explains everything without laboring....I have a basic Bubble exp but I could keep up. Question: If I were wanting to build for desktop and mobile, would I just start with a page at say 1280 and keep the guts at 960 max width maybe? Just a bit confused how to recreate this if I also want it to work on desktop. Appreciate your feedback.....And great style too!

[@BuildAppsWithoutCode]

Hi Simon! When designing for desktop and mobile I usually use a 1280px width for the UI builder. This gives me enough space to design for desktop. Then I test all screen widths as I go from large desktop to mobile. Usually there is a lot of conditions involved to make things look good on desktop and mobile. You can use conditions to show and hide different elements or change padding depending on the page width. E.g. You might have a separate navigation menu on mobile that only shows when Current Page Width < 640.

[@yashodhanbhatawdekar5175]

can you please make an updated video from the start where you added the data types? Also how did you add those dog images and usernames, in mine the preview shows no images or usernames..im a beginner in bubble so help would be appreciated.

[@BuildAppsWithoutCode]

Hi Yashodhan, make sure you set the 'Type of Content' on 'Group post-username' to 'Post'. If you don't set a type of content on the group, you won't be able to pull data into it. The data types we used are 'User' and 'Post'. The custom field names and field types I used are below: User--> Fullname (text) profile-picture (image) username (text) Post--> Caption (text) Image (image) User (User) Also if you want access to this exact Bubble project go to www.buildappswithoutcode.com/instagramclone. You'll be able to see the data types and everything else. Hope this helps!

[@H3NRY_B]

I don't understand how to implement this from your instructions here. I have started with this video and using bubble today so excuse my ignorance but would you mind helping me understand how to export the info you have from the read only file? It says I can't currently as I am not an admin.@@BuildAppsWithoutCode

[@user-ql6gs9ro5f]

its posible make an app video in bubble? nice contend

[@yely6955]

I have created my own data types same as yours, putting multiple entries but when I preview, It only shows 1 user in repeating group, why is that?

[@philcote5857]

10/10 Pinky and the Brain reference

[@BuildAppsWithoutCode]

Used to watch it daily! 🧠

[@H3NRY_B]

Thank you for help. I am learning how to do this for my MSc Leading in a Digital Organisation module, I am currently stuck at trying to add the condition onto the user's profile pic and text. When I type "1" the only option I am met with is "Desktop (1200 px)" do you understand why?

[@H3NRY_B]

I found that I had to type "1." for it to work. This was the same for truncating the text to 8, I had to type "8.".

[@H3NRY_B]

I just don't understand how at the point of 17 mins in Bubble knows who is the current user? How do you set this part up?

[@edwardbiolandes4690]

Can you please help me to build a simple app. I have an event coming and I want to make data entry easier. Client arrives to the stand, he enters his name, email, phone number, his title, company name. I would like to know if all this data will be saved somewhere that I can use later. I usually do this manually but i'd like to use a tablet where the client can enter his own details. That will save me a lot of time and make my work more efficient. Thank you in advance.

[@BuildAppsWithoutCode]

Hi Edward, feel free to email me at jason[at]buildappswithoutcode[dot]com and we can chat.

[@wt1272]

hello please, how did you add those dog images and usernames, in mine the preview shows no images or usernames. I'm completely lost

[@BuildAppsWithoutCode]

Hi WT, are you asking how I populated the database with test users and posts? Go to the Data tab and then to 'App Data'. Here you can click 'New Entry' and add test data.

[@ujjawaljadhav1639]

why didnt you showed us how you added data

[@tn1st55]

Dumb question; How did you get the iphone template?

[@BuildAppsWithoutCode]

Not dumb! I use Google Chrome Developer Tools, and then turn on responsive mode, and then use the iPhone 6/7/8 Plus emulation device. It might not be there by default, click Edit to find it if you need to.

[@jk9999999able]

how do you make the page responsive? i dont see the option

[@BuildAppsWithoutCode]

This app specifically is built for mobile only, so it is not responsive. I have another video that explains how to build using the responsive editor which might help! kzbin.info/www/bejne/jYCwi2CcjsaKY6s

[@jesusdcbernal710]

Sorry for asking but is this a native app or a web app ?

[@BuildAppsWithoutCode]

Good question! It's a web app, but it could also be a native app if you 'wrap' it. You need a third party service to wrap it before you send it to the Google Play or Apple App Store. I talk a little more about how to make a native app in this video kzbin.info/www/bejne/eHXbo5mdprWiqdE . Hope that helps!

[@ismailakbar6449]

Jason can I build an online auction with bubble.

[@BuildAppsWithoutCode]

I don't see why not! You can build basically anything with Bubble.

[@ismailakbar6449]

@@BuildAppsWithoutCode Thanks for your reply Jason. Just one more question. If you build a technology startup and it becomes hugely successful, would it hurt your chances to sell the company to buyers if your product is build with a 3rd party platform like bubble or would they not mind.

[@bretthorowitz6136]

What happened to the AirBnb app??

[@BuildAppsWithoutCode]

Haha I’ll do another one soon! Seems to be a popular one! 🙌🏻

[@Lifeofbpw]

@@BuildAppsWithoutCode how about building tripadvisor

[@BuildAppsWithoutCode]

@@Lifeofbpw I'll add this one to my list!

[@numetalforchrist]

@@BuildAppsWithoutCode hey can u help me create an app tiktok clone app

[@BuildAppsWithoutCode]

@@numetalforchrist yes I can! I'll send you an email.

[@jasonmasina]

Sup Ellie 🐶🐾

[@BuildAppsWithoutCode]

Sup