# Unit 5 Project: Build Instagram from the Ground Up - Part 1

:::warning
📬 Submit this assignment by **Friday, December 11 at 11:59pm IST** by emailing your GitHub repository link to [e-mail] 👉
:::

### Overview

In this assignment, we'll be building Instagram from the ground up. Instead of using the Instagram API, we'll be building our own backend using Parse. By the end of the assignment, you'll have your own Instagram app that talks to your own Parse backend.

* [Video playlist](https://www.youtube.com/playlist?list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6)
* [Assignment intro](https://www.youtube.com/watch?v=IfMTNMIwgHk&list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6&index=3&t=0s)

Check out the Helpful Hints Section below for troubleshooting or tips.

### Submission Instructions

* Make sure you are adding and committing files in git as you complete features and milestones
* Be sure to **include a README** containing a GIF walkthrough of your app.
* Use [this README template](/snippets/android_university/readme_templates/project_3_readme.md?raw=true) in order to have a complete README.

### Project setup

#### 1. Parse Server

Your first goal is to setup a Parse Server. This server is used to store the images and posts that are sent from your phone. See this [guide](https://guides.codepath.org/android/Configuring-a-Parse-Server#setting-a-new-parse-server) and definitely watch the video walkthrough.

* [Backend Setup](https://www.youtube.com/watch?v=9Kkbj_WSPyc&list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6&index=2)

#### 2. Parse Dashboard

You'll also want to see how data gets added to your Parse server. Luckily, Back4App provides a convenient Dashboard for you to use:

<img src="https://i.imgur.com/jaIfvI3.png" width=600>

### Required Stories

1. User can [sign up](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-signup) to create a new account using Parse authentication (_**1 point**_)
* You'll need to setup the Parse SDK and connect to the server you've just setup. See this guide on [Enabling Client SDK integration](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#setup).
* [Initializing the SDK and setting up Parse Login](https://www.youtube.com/watch?v=3bu0xvzKKZI&list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6&index=6&t=0s)
1. User can [log in](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-session-login) and [log out](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-logout) of his or her account (_**1 points**_)
1. The current signed in [user is persisted](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-session-login) across app restarts (_**1 point**_)

1. User can [take a photo](https://guides.codepath.org/android/Accessing-the-Camera-and-Stored-Media), add a caption, and [post it to "Instagram"](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#uploading-photos) (_**2 points**_)
* **Hint:** Parse has a limit of 10MB for uploading photos so you'll want to the code snippet below to resize the image before uploading to Parse.
* [Define Data Model](https://www.youtube.com/watch?v=3jBB4xDMb5k&list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6&index=7&t=0s) and [Image Capture and Post Creation](https://www.youtube.com/watch?v=xFp8fETmsnk&list=PLrT2tZ9JRrf74emXdHwSG6Q46-DEvuNA6&index=8&t=0s)

### Stretch Stories

1. User sees app icon in home screen and styled launch screen that looks like the real Instagram page. (_**2 points**_)
- Download image assets: [📎 instagram_android_assets.zip](https://courses.codepath.com/course_files/android_university/assets/instagram_android_assets.zip)
1. Style the feed to look like the real Instagram feed. (_**2 points**_)
1. After the user submits a new post, show an [indeterminate progress bar](https://guides.codepath.org/android/Handling-ProgressBars) while the post is being uploaded to Parse (_**1 point**_)

**Mockups:**

With required stories completed and a few optionals completed, your app might look like:


## Helpful Hints

Here's a list of useful notes you may find helps save you time while developing Instagram Parse or running into problems:

### Tips

1. Running into problems setting up Parse? Check out [this guide](https://hackmd.io/@YargtAEbS02eDE3upLu27g/codepath-parse-setup-hints) on common issues and how to resolve them.

1. Check the LogCat window in Android Studio to see the HTTP responses from the Parse server and verify you are not seeing HTTP timeout exception. Verify that you have [initialized the SDK](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#initializing-the-sdk) with the `HttpLoggingInterceptor` and custom `OkHttp` client.

1. Make sure that you are connecting to urls and images with `https://`. If you are using Android P (API 28) you are explicitly disallowed from making insecure `http://` calls (see [this section](https://guides.codepath.org/android/sending-and-managing-network-requests#cleartext-http-requests)).
- If you see a message in LogCat like `java.io.IOException(Cleartext HTTP)` or `com.parse.ParseRequest$ParseRequestException: i/o failure...`, you need to add the `android:usesCleartextTraffic="true"` attribute to your manifest file, as [shown here](https://stackoverflow.com/questions/53288020/picasso-doesnt-load-images-from-http-links-in-api-28).

1. If you want to verify data is stored on the Parse server, use the Database Browser in back4app (on the left side nav bar, under Core, there's a Database Browser section). You should be able to view the different collections on tables.

1. The authentication page will need to create a user account by signing up or login with an existing one. Review how to use Parse to [signup a user](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-signup) and [sign in with an existing account](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#user-session-login). You can also skip the authentication page if the user is already authenticated.

1. Having issues setting up the camera? Make sure to follow this [guide](https://guides.codepath.org/android/Accessing-the-Camera-and-Stored-Media) for accessing the camera.
- Make sure that the `android:authorities` in your `<provider>` definition your AndroidManifest.xml matches what you use in the `FileProvider.getUriForFile()` API call.

1. Having issues launching the camera?
- If you're running your app on a device that's running API 30+, you also need to add a `queries` block in your `AndroidManifest.xml` with an intent for IMAGE_CAPTURE like so: https://github.com/calren/CameraExample/blob/main/app/src/main/AndroidManifest.xml#L11-L18

1. Make sure to review how to create [Parse models](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#creating-parse-models). You will need to register the class before calling `Parse.initialize()` by calling `ParseObject.registerSubClass(Post.class)` in your `ParseApplication`. Your Parse object at the minimum should include a media object for storing a `ParseFile` object (see [guide](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#uploading-photos)), an author with a `ParseUser` object, a String for storing the caption text, and an integer for recording likes/comments.

1. Rendering ParseFiles in an ImageView can be done with [this guide](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#rendering-parsefile-objects). You can use either Glide or use the `ParseImageView` library.

1. Trying to do Parse queries? Make sure to review [this guide](https://guides.codepath.org/android/Building-Data-driven-Apps-with-Parse#querying-objects).
- Remember that you should sort the data with `orderByAscending(‘createdAt”)` to make sure data comes back in chronological order.
- Trying to get the `createdAt` or `updatedAt` field? (i.e. get("createdAt"). These fields are special properties that can only be accessed as getCreatedAt() or getUpdatedAt() even though it looks like any other key/value pair in the Parse Dashboard. If you’re curious, see how the Parse Android SDK decodes this info with this [link](https://github.com/parse-community/Parse-SDK-Android/blob/master/Parse/src/main/java/com/parse/ParseObjectCoder.java#L111-L118)
- Make sure to include the include(‘user’) to retrieve the username from a Post object and use the Parse.Query static builder consistently everywhere in code.
- If you’re getting back null for a custom property, double check the column name. Only the `createdAt` and `updatedAt` are treated special.
- If you get a Pointer reference issue, check the column type. Make sure it points to the right type (i.e. if you accidentally declared a reference to a different object and later change it, you may need to clear all the rows and deleting the table schema)

1. Remember if you use saveInBackground() and wait until the save is completed before showing the home timeline, you could have a strange user experience where the user is doing other stuff. You may wish to throw up a progress bar until the operation is completed. If you decide to use save() to block until the save is completed, Android may show you an Application not responding issue so best to avoid doing so.