Other Use profile page

[kesdlvi]

Right now we only have a user profile page, we will also need a profile page for all other users.

Here are the steps:

(This is under the assumption that you have already made a the proper files and css files)

1) Let's consider the profile page. It is composed of the ProfileNavbar UserHead and UserStats components. This page will also want to use these. Thus we import them at the very top of our code.

import UserStats from '../templates/UserStats.js';
import UserHead from '../templates/UserHead.js';
import ProfileNavbar from '../templates/ProfileNavbar.js';

Now we begin to build the page.

Our code should look something like

import UserStats from '../templates/UserStats.js';
import UserHead from '../templates/UserHead.js';
import ProfileNavbar from '../templates/ProfileNavbar.js';

const OtherProfile = () => {
     return (
          <h1>Other Profile Page</h1>
     )

export default OtherProfile

2) Now we build the page with our components.

within the return (... we first include our jsx opening and closing tabs <> and </>

Thus looking like:

 return (
          <>

           {*/ Our Code /*}

          </>

     )

Now we lets first include <ProfileNavbar/> between the jsx tag like so:

 return (
          <>

           <ProfileNavbar/>

          </>

     )

We should be able to see a simple navbar on the top of our page.

3) Now lets add UserHead into our code.

First we create a div for all the page contents, that is separate from the ProfileNavbar then we include UserHead into this div

 return (
          <>

           <ProfileNavbar/>

           <div className='profile-contents'>
                <UserHead />
            </div>

          </>

     )

<UserHead/> actually takes in props for the profile photo and username (but we will omit these for now)

Now we should see a photo of Drake with his silly username next to it.

4) Now we just also add UserStats to the div right below UserHead

Now our skeleton for the other users profile page should be done. Make sure to test on your local machine. Consult with Kevin or Travis when you are ready to commit and merge to prod.

(If you can also try to get a Follow button added, it should be right below UserHead)

Please let me know if there are any other issues Good Luck :)