Ironhack Logo

Express File Uploads V2 | IronTumblr

Requirements

Important VERY IMPORTANT PLEASE!!

create .env into folder lab-back

DB=***********
PORT=3000
CLOUDNAME=***************
CLOUDAPIKEY=************
CLOUDSECRET=******************
SECRET=*****************

Submission

Upon completion, run the following commands

$ git add .
$ git commit -m "done"
$ git push origin master

Navigate to your repo and create a Pull Request -from your master branch to the original repository master branch.

In the Pull request name, add your name and last names separated by a dash "-".

Include a link to your deployed heroku app in the pull request.

Deliverables

Complete all of the non-bonus iterations. No styling is required, but is suggested as bonus.

Instructions

Introduction

Tumblr is an ultra popular microblogging website.

A microblog is:

A social media site to which a user makes short, frequent posts.

This is easier shown than described, so check out this tumblr filled with funny dog memes.

Part 1

Iteration 1 | User Profile Pictures

In the starter code, we've already provided a User model and the authentication logic. Unfortunately, the user doesn't have a profile picture.

Fix the User Registration so that it allows the user to upload a file as their profile image.

this part is already in folder lab-back with jwt and includes a json for insomnia to import and use the request.

Iteration 2 | Posts

In this iteration, create the bread and butter of Tumblr, the Post.

A post should have the following attributes:

  • content - Text belonging to the post
  • creatorId - ObjectId of the post's creator
  • picPath - Where the picture is stored
  • picName - The picture's name

For this iteration you must create the model, along with the new, create, show and index routes. This should include file uploading.

A user should be logged in to create a post, but not to view.

The index will be the home page, and simply display all of the posts on the website.

Part 2

Iteration 3 | Comments

Posts have comments attached to them. Create the Comment model as a subdocument of the Post.

A comment can have images attached to it, but not all do.

The model should have the following attributes:

  • content
  • authorId
  • imagePath
  • imageName

You should create routes to create new comments. Comments should be displayed on the Post show page.

Recomendations 🚧

  • Remember this lab should go with his frontend on react (folder already included )

  • You don't have to create super styled frontend we only verify your skill at the time of realizing frontend and back conections.

  • Remember to use postman or insomnia to check all your endpoints!

Iteration 4 | use Hooks to create a priview

remeber use { useState } to use hooks and create a priview image to upload

  • GoodLuck 💀