HASHTAG Social Media Project

overview :

HASHTAG is a Full-stack web it builds like social media website you can post your images and your story like any other social media website, in HASHTAG website is still in development it needs a lot of features to add.

The Technologies we used :

In this small project we usded for :

• FrontEnd
  

  • HTML
    
  • CSS
    
  • Javascript
    
  • Fontawesome
    
  • Rest Full Api
    
  • React Js
    

• backEnd

  • Node Js
    
  • express Js
    
  • MongoDb
    
  • Build Rest Full Api
    

Some challenges we faced and some features I hope to add to the project :

I had faced many challenges, especially with the backend in MongoDb some queries didn't work with me and it takes to me a lot of time but I fixed them, and I hope to add some features like Chats and Following Friends each other.

How to install HASHTAG project :

1 - First, make sure you have Node js installed by running the command node -v
Make sure you have like this results :

If you don't have like these results go to Node js Download and install it on your machine.

2 - Seconde, make sure you have MongoDb installed if not go to Monog Db Download and install it on your machine.

3 - Now go to your terminal and run this command to download project on your local machine.

git clone https://github.com/Zaariy/Hashtag.git

Make sure you have like this results in your Folder :

4 - Now go to backend folder , path folder is : /Hashtag/backend
And start installing dependencies by running this command in your Terminal : npm install --save

Make sure you have like this results in your Terminal :

5 - Now go back to the folder /Hashtag and install dependencies React js
by running command npm i

6 - Now let's do some settings on file /backend/Router.js
go to the line 15 and put your local url MongoDb to connect with Database , Default value is : mongodb://localhost:27017/hashtag and don't forget to add /hashtag in last of url .

7 - finally it is last step , go to backend Folder and run command : npm start
And then go back to the Folder Hashtag and run command : npm start .

Make sure you have like these results in your Terminal :

Let's take a look at Roadmap Components and their Child's

Profile
    |__ Postes
    |__ Photos
    |__ about
    |__ Friends

Mainpage
    |__ Navigation
    |__ Postes
        |__ createPhost
        |__ Likes
            |__ comments
    |__ sidePhotos
    |__ sideFriends
    |__ story
    |__ groups

Settingsprofile
    |__ Navigation

Documentation :

How we can pass data from parents to their children's ?

As you see above every parent component pass data to their children by parameter or "Props" call ueser_public_data if data was public and if it was for just a user it call user_spcific_data , and when we want to recieve this data , we recieve it by parameter call recieve_public_data if data was public and if it was for just a user it call recieve_spcific_data As you can see in this picuter :

How we can pass Childrens from componentns to another components ?

if we want to pass children component to another component we pass it through parameter or "Props" call Child_pass_data As you see in this picter :