× Front page of website
× Association  Members Page
× About Page
× Notes Section
× Update Notification showing
× Mobile view and night mode

Front End Design

HTML 5CSS 3Javascript BootstrapWordpressReactNextjsPhotoshop
HTML 5CSS 3Javascript BootstrapWordpressReactNextjsPhotoshop

by Karl Janred

Skills

Photoshop10+ years
  • Santa Rosa High School ArtQuest: Digital Arts Alumnus
  • Can make any document in any style for print or web
HTML / CSS7+ years
  • Hand coded HTML / CSS sites in high school.
  • Thorough understanding of foundational languages.
WordPress / Bootstrap3+ years
  • Started using Bootstrap to assure responsiveness.
  • Created sonomachiefs.org using WordPress.
JavaScript, React, Next.js1+ Year
  • Created responsive CRUD applications
  • Implemented JavaScript into my everyday use.

Photoshop Work

Dentist Ad Example
dentist ad thumbnail
Social Media thumbnail
bandcamp profile thumbnail

Web Projects

Sonoma County Fire Chiefs Association

A WordPress based solution for the SoCo Fire Chiefs Association

The Sonoma County Fire Chiefs Association needed to bring their website into the modern age. Two other SRJC students and I utilized WordPress and Bootstrap to create a responsive and user friendly solution for the Association. Our goal was to make a solution that was easy for the client to update and change without having technical knowledge. The client's most important needs were:

  • Inform the public of Association actions
  • Centralized location for Fire Fighter's web based tools.
  • Inform the public of emergencies.
Sonoma County Fire Chiefs' Association thumbnail 1
Sonoma County Fire Chiefs' Association thumbnail 2
Sonoma County Fire Chiefs' Association thumbnail 3
link

EasyNotes CRUD Application

Full CRUD application using Next.js, Firebase, and Chakra UI.

Created as an exercise to learn React and Next.js. Utilized Firebase to allow users full CRUD capability of their notes. Users log in with their Google account and can create and modify various types of tasks and notes. Chakra UI was utilized to gaurantee both accessibility and responsiveness.

EASYNOTES thumbnail 1
EASYNOTES thumbnail 2
EASYNOTES thumbnail 3
github logo link