Skip to content

SheCodesAus/boolean-bears_frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

110 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Yarning Circles

Boolean Bears

Table of Contents

Mission Statement

This project aims to create a dynamic and accessible peer-learning platform that empowers individuals to build knowledge, develop new skills, and learn collaboratively in a supportive environment. The goal is to make learning more accessible by enabling users to create, and participate in shared content. Users will be able to contribute written content across a range of predefined categories, helping others discover content that aligns with their learning preferences.

By combining user-generated material, the platform promotes ongoing skill development and continuous learning. Whether someone is seeking to upskill, explore a new hobby, or connect with others on a shared topic, this platform provides a central space to collaborate, learn, and grow together. The focus on accessibility ensures that users of all experience levels can easily navigate and contribute to their learning communities.

Features

Summary

Visitors to the site may browse user created courses on a range of subjects. Creating an account allows users to create courses, enroll in available courses and provide feedback to other users through a course rating system. They may also track their course creation contributions and enrollments via their personal profile page.

Users

Type Access Role type assignment
Account holder - Can log in
- Can log out
- View course cards
- View course details and enroll in courses
- Post comments to courses
- "Like" and rate courses
- Create and manage courses (update and delete)
- View sumamry of course creations and course likes via Profile Page page
Educators, learners
Guest - View course cards Public, anyone visiting the website

Courses

Feature Access Notes/Conditions
Create Logged in user - Organised by specified categories
- Allows written content supported by additional uploaded images, videos or pdf documents
Post Logged in user Submits course to website
View - Public may view all all course cards on Home Page
- Logged in user may access full course details
- Trying to access full course without login, will navigate to login page
Edit Courses can be edited by the course creator
- Update button only visible on course page to creator
- All course fields are editable
Delete Courses can be deleted by the course creator (logged in) - Delete button only visible on course page to creator
- Course deletion confirmation required via popup message
Max students Public and logged in users can view via course card - Course willm not allow further enrollments if max student cap is reached
Open/Closed Public and logged in users can view via course card - Open allows more enrollments until max student cap, then closed

Pages/Endpoint Functionality

Endpoint functionality comments
Landing Page
- All users
- Displays basic information regarding the website
Home Page
- All users
- View existing, open courses via course card
- View featured courses (most liked)
- Search and/or sort course list

-
-
-
About Page - Features short bio of development team
- links to team member social media

-
Create Account Page - All users - only 1 type of user
Login Page - Users can log in using created username and password
Create Course Page - Create course
- Written content entered into course content field, which supports formatting
Supported by additional uploaded images, videos or pdf documents
- Only these fields are necessary; -
Course Page - Logged in, enrolled users may view
- Can "like" page
- Can leave comment
- Can rate course
Can view all course content and open supporting material
Course owner will see update and delete buttons
Requires auth
Update Course Page - Logged in, owner users may view
- Can update all course fields
Requires auth
Profile Page
- Can view their personal info, date joined, courses created, courses liked
- show badges earned through contributing to course creation
Requires auth

Nice To Haves

  • Admin approval of courses after submission but before going live on website
  • Profile picture upload
  • Report to admin button
  • Course Likes
  • Course Comments

Technical Implementation

Back-End

  • Django / DRF API
  • Python

Front-End

  • React / JavaScript
  • HTML/CSS

Git & Deployment

  • Heroku
  • Netlify
  • GitHub

This application's back-end will be deployed to Heroku. The front-end will be deployed separately to Netlify.

We will also use Insomnia to ensure API endpoints are working smoothly (we will utilise a local and deployed environment in Insomnia).

Target Audience

The platform is designed for digital users of all abilities, with a strong emphasis on inclusivity and accessibility. It supports adult learners who are looking for flexible, self-paced opportunities to engage with content across a variety of topics. The platform aims to provide an environment where anyone can confidently participate, gain new skills, and connect through shared interests. A platform where users are enabled to share their knowledge with others by creating and sharing course content on categories they are interested in and have the information.

Front-end Implementation

Wireframes

Version 1 Wireframe Mockups using Figma: https://www.figma.com/design/MvUZqotahvOb2KXMQnBfro/She-Codes?node-id=0-1&t=8qztp4caQR7hQPzq-1

Home Page

Homepage Wireframe

Login Page and Create Account Pages

Create Account and Login Page

Create a Course Page

Create Account and Login Page

Course Detail Page

Create Account and Login Page

Logo

Transparent logo Logo

Colours

The page backgrounds will be white, with the colours from the palette below being used as accent colours (header/footer/in text elements etc). This is to ensure the website retains a clean and uncluttered look and feel, using the colours in a meaningful and impactful way. The colour palette is an extension of, and complimentary to, our logo.

Colour Palette

colours colour palatte

Fonts

  • Source Sans 3 (majority)
  • Playfair Display (headings)

Google fonts used:

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
``

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 6