Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 71 additions & 0 deletions docs/teams/developer-relations/frontend-engineering.md
Original file line number Diff line number Diff line change
@@ -1,2 +1,73 @@
# Frontend Engineering

## Web Development with Gatsby

## Introduction

Static sites are incredibly prevalent among web development as they are useful in terms of performance. Gatsby is renowned for its intuitive design as a static site generator which is why it is the ideal tool to teach Front End Programming. Gatsby offers great functionality with its many plugins and easy incorporation of Graphql. Here at Bit, we believe that Gatsby will be increasingly prevalent in the Front-End development scene and want to host a Bootcamp to share this knowledge with undergraduate Computer Science communities.

## Mission
Our Bootcamp will be divided into three segments, each taught over one week. When combined, student’s will have developed an app that is a culmination of a variety of Computer Science skills. Learning to use Gatsby allows for a foothold in app-development, as well as an introduction to a powerful application called the JAM stack. Gatsby is essentially a tool when utilizing the JAM Stack which is why we want to provide the means for students to learn how to use it. As Gatsby becomes increasingly useful in app-development, so does the need to learn its functionality. Here at Bit, that is what we strive to provide.

This bootcamp is designed to give students insight into using Gatsby to develop a static site for real-world sources. It is tentatively scheduled to be April 27 - May 15.

## Topics Introduced
### Week 1

Topic 1:
Front End Programming
Explain Front End Programming and its applications
Talk about various stacks that are used for modern program
Introduction to MongoDB, Gatsby, and React
Topic 2:
MongoDB Atlas
NoSQL Databases
Clusters and Collections
Importing a Databases
Topic 3:
MongoDB Compass
Introduction to Compass
NoSQL databases
MongoDB Terminology in relation to SQL
Unique advantages to each type and what makes them different
Features of MongoDB as a NoSQL database
Topic 4:
MongoDB Stitch
Stitch functionality
Backend Programming with Stitch
Linking Stitch with Atlas
Creating backend for our app
Creating our own API
### Week 2
Topic 5:
Gatsby
Static Site Generators
Gatsby Develop
Linking between web pages
Topic 6:
Components with React
Building Components using React
Importing Components into our web application
CSS
Topic 7:
Gatsby Plugins
AllMarkDownRemark
Sass CSS
Topic 8:
API’s with Gatsby
Contentful
### Week 3
Topic 10:
GraphQL
GraphQL Query
GraphiQL
Setting up our GraphQL Query
Topic 10:
Putting Everything Together
Linking our MongoDB stitch function to Gatsby site
Integrating Google mapping API
Working with Algolia and GraphQL
Further integration of React Components