da-colon / codetrain

CodeTrain

An online forum for coding bootcamp students to share learning resources and prospective employers to post their job listings and connect with students.

Description

A community of coding bootcamp students and employers looking to hire new developers. Bootcamper students can share learning resources with each other and apply to job posts. Company representatives can list their job opprtunities here and connect with bootcampers.

Motivation

There are many online resources to learn coding and find job listings, but none tailored specifically for coding bootcamp students and employers looking to hire them. With the rising popularity of coding bootcamps, we wanted to create a centralized space where bootcamp students can share learning resources that helped them learn. Employers looking to hire new software engineers will find a community of eager and motivated developers here as well.

Challenges and Solutions

Screenshots

Technology used

Built with

• React: Javascript library used to build the frontend client of the application. Primarily built with functional components and react hooks.

• Express and Node.js: Framework used to build the backend server of the application. Models and routes serve as an API for the client.

• PostgreSQL: SQL databases used for all data storage in the application. SQL quereis are used in the models for all CRUD operations. Tables in the DB store user info, resource posts, job listings, applications, messages,and reports.

• React-Router: Navigational components used for all page routing throughout the website.

• Redux: Application state manager used to store the user data of logged in users and pass it to components throughout the application.

• Passport.js: Middleware used for user login authentication.

• Bulma/Bloomer: CSS framework used to style many components in the application.

• Styled-components: React component styling used to create custom unified styling throughout the application.

Features

• Three different user roles (student, company, admin) with unique functionality and views for each.

• User account creation and logins with user authentication.

• Personal user and company profile pages to share user and contact information

• Board of learning resource posts and job listings with full create, read, update, and delete actions available.

• Bootcampers can apply to job listings. Company users can review applicants' qualifications and reject or accept them to go forward in the hiring process.

• User messaging and reporting system. Users can send and reply to messages from other users. Regular users can report issues to be resolved by admin users.

Code Example

Installation

Clone or download the repository to your local machine. Install node modules with "npm install" in client and server folders. Run a development environment with the follow scripts:

• Client folder: "npm run start"
• Server folder: "npm run dev"
• Create/reset database with schema and seed data: "npm run db:reset"

Tests

How to use?

Credits

• David Colon: https://github.com/Da-Colon
• Daniel Farlow: https://github.com/daniel-farlow
• Nep Orshiso: https://github.com/neporshiso
• Prescott Sun: https://github.com/prescottsun

codetrain's Issues

[Admin User] - /home - Admin can view and approve unauthorized bootcamp users

[Admin USER]

• create report buttons on Company, Bootcamp profiles
• create report buttons on Resource and Job posts
• create database table for handling reporting
• admin can message reported users
• admin can delete report items
• create model/route to get reports
• create model/route to resolve reports
• create model/route to message reported users
• admin can resolve issues
• admin can search users and companies

remove report button if it is user/Company own profile page

reporting

company and user shouldn't see report button on own profile

Company User - There's not a way currently established where we collect the information necessary to populate the companies table. Upon account creation, company user needs to be authed by default.

Company should be able to message applicants

Company User - /jobs - Displays the jobs they posted with links to /jobs/:id

For company user, render job board with only company job posts. Button links to submit form.

Scaffold and write the routes for Company User

companies page: create company, read company info, update info,

• route
• model

Currently don't have personal_website and/or about_me in users Table

Would it be beneficial to include this data which would be populated in a users profile?

Bootcamp User & Company User - Add ability to edit profiles. Add about me and personal portfolio links to bootcamp user profile.

[Bootcamp User] - /resources - User can CREATE, READ, UPDATE, and DELETE resources

• Model and router functions needed: CRUD resources model, resourcesRouter

• Data set/used from backend API / store / local state: tables ( posts_resources.*, users.first_name, last_name)

• Navigate to this component from: Navbar > Resources

• Component renders:
  Read - Card element, list of resources with info (title, description, url, author name, date posted, upvotes/downvotes), ordered by score/date
  Create / Update - Form element with inputs for title, short_description, full_description, resource_url
  Delete - Button on read component that deletes resource on click

add post_resource

• route
• model

[Company User] - /home - User can see two cards that are tied to /jobs and /applications

• Model and router functions needed: Read from posts_jobs and job_applications tables, join on job_id, where company_id is their company

• Data set/used from backend API / store / local state: tables( posts_jobs, job_applications, users)

• Navigate to this component from: Company Dashboard, Navbar

• Component renders: Card elements, list of job titles, date posted posted by company,
  list of applicants with names, skills, and other user info

job applications: create, read, update(accept, reject), delete

• route
• model

[Public & Bootcamp User] - /resources - User can view all resources

• Model and router functions needed: Get all from resources table, resourcesRouter

• Data set/used from backend API / store / local state: title, short_description, full_description, resource_url, users_id

• Navigate to this component from: Navbar

• Component renders: Card element, list of resources displaying data fields, route to full description, links to resources

[Bootcamp User] - /applications - User can view the jobs they have applied to

• Model and router functions needed: Read from job_applications, join posts_jobs , where users_id is themselves

• Data set/used from backend API / store / local state: tables( job_applications, posts_jobs, logged in user_id)

• Navigate to this component from: Navbar > Applications

• Component renders: Card element, list of jobs the user has applied for with job info, current status of application (accepted, rejected)

README needs to be written/updated

[Company User] - /applications - User can manage the applicants for their company job posts

• Model and router functions needed: /job-applications
• Data set/used from backend API / store / local state: backend API
• Navigate to this component from: Can visit /applications from link in nav bar and from the company dashboard
• Component renders: 1. jobs company has posted.

2. which company user posted that job.
3. the bootcamp users who have applied to that job.

[Company User] - /profile - User can view their own Company Profile/Page

• Model and router functions needed: companiesModel, companiesRoute

• Data set/used from backend API / store / local state: from companies table, email, name, company_url, company_logo_url

• Navigate to this component from: Navbar > Profile

• Component renders: Card element that displays Company Name, Company Email, Company URL, and an image tag with the src set to the company_logo_url. URL links are wrapped in anchor tags other than img tag.

Style job headers to use bread crumbs

Style resource headers to use bread crumbs

Need to ensure that all URLs given by users have http:// as their prefix.

Ran into an issue when linking to a bootcamp users github page. The seed data for github_url does not have http in front. but the linkedin profile does. So either on the client or server side, need to make sure http:// is in front of the url. Keep in mind, most people don't include that when typing their own links.

User session is not saved in backend

User login currently only authenticates user and passes user information to the client. No session data is saved.

Polish codetrain demo day issues

• render sent messages
• refresh messages after sent
• form bulma styling
• styling buttons
• update home view buttons (company)
• fix loading first job applications page
• fix report bugs in messages
• take care of html buttons
• add beginning https://
• Add a modal that is shown when a company user clicks to remove their job post. Like what happens when deleting a resource.
• Center company and bootcamp profiles on the page
• Company home needs styling
• Work on styling on /applications for company user
• Gather and add seed data ( could put this in a separate .sql file to avoid merge conflicts in the main seed.sql file )
• DOM Nesting anchor tag issue ( think it's tied to jobs )
• Job Cards need polishing.
• Margin between news column sources in /home bootcamp user
• Style the application view for bootcamp user
• Select a background color to create more contrast with the cards
• Fix applying to jobs issue (only user with id 2 instead of user_types_id 2 was able to apply)

Need to retrieve some sort of data from backend. Please write this logic.

[Company and Bootcamp Users] - /messages

• create messages component
• Users can create and send messages
• users can view messages sent to them
• create backend route for messages
• create backend messagesModel
• Company can see messages on /home

styled-components for layout

[Public & Bootcamp User] - /dashboard - User can view HackerNews and TechNews data

• Model and router functions needed: N/A - This is a client side API call

• Data set/used from backend API / store / local state: HackerNews and News API

• Navigate to this component from: Redirect after Login. Also NavBar > Dashboard

Component renders:

• Container displays top stories from HackerNews API
• Container displays top stories from TechCrunch API (News API)
• Data from both news sources include Title, Preview, Date Posted, Author, external URL

[Any User] - When a user is logged out, "Log Out" is displayed in the nav bar. This should read "Log In".

A user can submit to the same job multiple times even if they have already applied

add logout : DA_COLON

• route
• model
• add sessions or token to save login status

Create individual job and resource post pages. Link to them.

[Bootcamp User] - /jobs - User can view jobs and apply to a job

• Model and router functions needed: for viewing jobs... Get all jobs from posts_jobs table and a join on companies_id to the companies table to access company_name.

To apply to a job... create job application in job_applications table

• Data set/used from backend API / store / local state: From posts_jobs and companies tables... title, content, experience, date_posted, contact_email, contact_phone, company_name, company_profile, company_url

Will be creating a new entry in job_applications table from user payload

• Navigate to this component from: NavBar

• Component renders: List of Available Job Post Cards in a JobBoard Component. Apply button that submits POST request to above endpoint. A success message upon successful POST req to above endpoint.

Fetch HackerNews and TechCrunch APIs to populate Bootcamp User Dashboard

Update form for resources needs major styling

[General user] - / - Landing Page

Short description of website.

Links to sign up and login

sign up company

add some logic to the backend to check in the database to for company if it exists grab the id and attach it to user. if it doesn't then create a new company

add login : DA_COLON

• route
• model

Company user can create job post

ResourcePost.jsx needs to be updated to reflect the new version of BootCampResourceGet.jsx

Should probably try to think of a good way of condensing this code instead of duplicating things

Scaffold and write the routes for Bootcamp User

[Company User] - /jobs - User can create a job post

• Model and router functions needed: Post to posts_jobs table, resourcePosts

• Data set/used from backend API / store / local state: user_id, title, short_description, full_description, resource_url

• Navigate to this component from: Navbar > Jobs > Add Post

• Component renders: Form element, inputs for data fields, submit button posts to API/DB

File Storage for database

We will need to figure out whether to use file storage with file path in Database or convert and store PDFs as binary in database

[urgent] User profile not working although it was working on my machine

add signup : DA_Colon

• route
• model

add post_job,

• route
• model

Login and signup forms

[Public & Bootcamp User] - /profile - User can view Profiles

• Model and router functions needed: Get user by Id, userModel

• Data set/used from backend API / store / local state: user_id from global store. first_name, last_name, skills, github_url, linkedin_url, bootcamp_name

• Navigate to this component from: Navbar > Profile AND a Resources Post will have an Author field > Profile

• Component renders: Component renders as a Card Element, information is displayed in a list, and URLs are displayed as links

Links to news should be made to open in new tab not in same page as it will log out user

Anyone visiting the site can see form for submitting resources. should only be bootcamp users.

• not logged in
• company