Skip to content

Harkins12345/SigmaMedia

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

87 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🔥 Sigma-Media 🔥

Lap 1 Project with our amazing group: Diren, Jianli, Michael and Onur! We decided to create an anonymous social media website aimed at a specific demographic of people who are obsessed with self-improvement and helping others! 👏

The website is deployed on Heroku:

http://sigma-lap1-project.herokuapp.com/

To run this project locally:

cd ../SigmaMedia run npm install and then run npm start

Open http://localhost:3000/ in your default browser

Project Brief 💭

  • You will be working in small teams to create a community journaling website.

Project Requirements ❗

Functionality 🌞

  • Users should be able to visit the website and anonymously post journal entries.
  • Users should be limited to how many characters they can put in an entry.
  • Users should be able to add gifs from giphy in an entry.
  • Users should be able to view other peoples' entries.
  • Users should be able to react to other peoples’ entries with an emoji.
  • Users should have three emojis to choose from.
  • Users should be able to comment on other people’s entries.

Technical Requirements 🌚

  • Aim for minimum 60% test coverage (In future projects this will be enforced with an aim for 80%)
  • Your repos should have excellent READMEs. See our Writing READMEs guide for details.
  • Your website should be deployed (You could use eg. Netlify for client, Heroku for server)
  • Your codebase should make good use of the technologies we have covered so far on the course: HTML, CSS & vanilla JS
  • You may bring in some node libraries for specialised behaviour eg. dayjs but no large front end frameworks such as React.
  • Your website should not have a database connected, instead any data sent and stored in your backend should be saved within .json files.

Presentation

  • Prepare a 10 minute presentation covering the following topics: ** Purpose of App ** Planning & Delivery ** Technologies and Code ** Challenges and Solutions ** Significant Code / Code you are proud of (include snippets!) ** Test Coverage ** Future Features & What We've Learned ** Live Demonstration
  • There will be a 5 minute opportunity for Q&A after each presentation

Planning 😩

We used a Kanban Board and Adobe Illustrator to plan our our first moves and designs

Kanban Board

alt text

Adobe Illustrator

alt text

Wins 😎

  • We were all enthusiastic about working on Sigma Media and had a great time!
  • We learned how to work together on a project by incorporating everyone's ideas.
  • On GitHub, we learned how to use the kanban board.
  • We learned how to deal with merge conflicts and work on multiple projects at the same time.
  • We discovered how to use socket.io to make real-time changes to our website.
  • It was a lot of fun designing a female version of Chad in Photoshop, Illustrator, and Lightroom.
  • It was also a lot of fun creating prototypes and our own SVG icons in Illustrator and Photoshop.

Challenges ❔

  • Merge conflicts 😱
  • Remembering how to use photo editing software
  • Utilising socket.io for the first time
  • Updating the web page in real-time
  • Working with 4 people simulaltenously working on the same repository using different branches
  • Getting the Users Online section working

Issues with Putting Emojis in the Input

alt text We gave up using this since it conflicted with our backend

Bugs :trollface:

Future Features 🐲

Final Product 🌷

About

LAP 1 Project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • CSS 38.8%
  • JavaScript 25.8%
  • HTML 21.6%
  • EJS 13.8%