Q4 Front End Dev Onboarding

DOCUMENTATION

Here you will find documents and links needed to help get you set up and started as a Q4 Front End Developer…section titles link to appropriate resource or tool.

Q4Launch Website Onboarding Process

This document outlines the Q4 Website Onboarding process

Q4 Framework Breakdown – Variables

This document breakdowns the _variables.scss file and explains what each SCSS variable controls

Website Section Examples – Code Library

This document shows visual examples of the website section options as provided in the Style and PHP/HTML code library files

 

TOOLS/RESOURCES

Code Library*

Our code library is a resource of prebuilt and pre-styled sections we commonly use in our web designs. Use this resource to streamline the build process. You may come across builds that require custom built sections. As we build new sections be sure to update the library with these newly built sections.

Also included in our code library you find pre built JS functions that are commonly used.

Codekit

For now we are using codekit to compile the SCSS while working only in the Child Theme…not necessary for Parent Theme.

Transmit (version: 5.5.0, do not use any other version)*

Transmit allows you upload code updates to the servers.

Local Environment Setup*

We have a docker setup for our local environments. The link will take you to our github repo where all files and instructions to setup the local environment live.

VSCode

You are free to use the text editor of your choice. If you choose to use VSCode you will find all resources you needed here (ie custom snippets, extensions, etc).

Image Optim

Image Optim is a tool we recommend using to compress large images before uploading to WordPress. Keep in mind, though this cleans the images of unnecessary data you will still need to upload into Photoshop to compress to the appropriate size (max 100kb image size).

Avocode

Mockups are stored on Avocode. The FE Dev can obtain the different values (ie pixels, colors, text, etc) needed to building the websites.

*NOTE: Access must be granted to our github repo before accessing these resources/tools

Website Repos*

Here are the github repos for our individual sites. Use these repos to setup your local environment as listed in the Local Environment Setup repo

Leave a Reply