Oasis Full Stack Series

Tools of the Trade

This semester's Oasis Series, Full Stack, is your gateway to the skills indispensable to creating powerful, interactive, web applications with your team. As one of the foremost media for developing applications today, web technologies allow you to easily make large-scale applications using popular languages.

Below we outline the course lineup for this semester. You are welcome to attend any or all that pique your interest.

WORKSHOPS

Workshop 1⁠ — Idea Generation

Overview

This workshop is your opportunity to devise the project idea of your dreams! If you've been struggling to conceive of an idea, in the process of refining your latest opportunity, or just want to meet other like-minded individuals looking for inspiration for a great project, this is the workshop for you. We will be discussing brainstorming strategies and working together to pick out great ideas

Goals

• Leave with at least one idea you are excited about pursuing through Oasis

• Acquire the tools to more easily come up with new ideas in the future

• Begin creating connections among other participants, potentially even leading to a team formation

Recommended Preparation/Readings

None

Registration Link

https://forms.gle/RP4CstssGEAjhNVJ7
Coming soon!

Workshop 2 — Product Design and Mockups

Overview

This workshop is your introduction to the world of design—what it is, why we do it, and how it's typically done. And then we'll go ahead and try it out! We will discuss what mockups are and the various levels of fidelity in which they can be made. We'll also discuss how and why to solicit your peers for design feedback and then dive right in to making our first website mockup using Figma, a free web-based design tool

Goals

• Understand why creating mockups are useful before writing any code

• Understand the difference between and uses for different levels of fidelity in mockups

• Learn strategies for soliciting user feedback for designs

• Create a first basic mockup using Figma

Recommended Preparation/Readings

Create a free Figma Account here

Registration Link

https://forms.gle/y11GKqQxHY3QYRyWA
Coming soon!

Workshop 3 — Introduction to the Web

Overview

This workshop is intended to serve as your introduction to the workings of the web—how it functions behind-the-scenes, what the anatomy of a web page looks like and how to actually create one of your own. In the process, we will cover what takes place when you visit any website and how to write basic HTML, CSS, and JavaScript code

Goals

  • Understand what happens behind-the-scenes when you browse the web
  • Understand the languages that make up web pages
  • Learn the basics of HTML, CSS, and JavaScript
  • Create a basic web page using HTML, CSS, and JavaScript and view it in your browser

Recommended Preparation/Readings

Registration Link

https://forms.gle/gNEqDz16e7yzmSQA6
Coming soon!

Workshop 4 — Intro Frontend Web Development

Overview

This workshop serves as your first step into frontend development on the web—creating the interactive experiences that people use in their web browsers. We will learn about different ways to go about developing a frontend, why people may opt for using a framework or library such as React instead of pure HTML/JavaScript code, and then dive into creating our first frontend application using React

Goals

  • Understand how web applications work and why they are useful
  • Learn about various popular frontend frameworks and dive into a very popular one, React
  • Create your first basic web application using React

Recommended Preparation/Readings

Registration Link

https://forms.gle/sSkKBy6EjwzhYP7x5
Coming soon!

Workshop 5 — Backend Development

Overview

An web application's backend is a separate application that runs on a server far away. Our frontend application communicates with it to handle important operations such as logging in users and storing application data. Without a backend, our application's capabilities are limited. In this workshop we will learn more about what backends are and how they are used, and then dive in to creating our own backend REST API using Node.js and Express.js

Goals

  • Create your first application backend using Node.js and communicate with it from a frontend
  • Understand what REST APIs are and how they are used
  • Learn about why backends are useful for our applications
  • Learn about various options available for creating backends

Recommended Preparation/Readings

  • Download Node.js for your system here

Registration Link

https://forms.gle/mvzWQBdWw5LUwr9e9
Coming soon!

Workshop 6 — In-Depth Frontend Web Dev

Overview

In this workshop we will dive back into frontend developing, covering important topics such as making and handling backend requests, lifecycle hooks, and other strategies to make our code more robust.

Goals

  • Understand how to make network requests to our backend
  • Learn about adding basic type checking to your React code
  • Revisit proper usage of state and lifecycle hooks
  • Further solidify newfound React skills

Recommended Preparation/Readings

None

Registration Link

https://forms.gle/6CgjvDcngJWVT1AW8
Coming soon!

Workshop 7 — Hooking up to a Database

Overview

If an application stores data—user accounts, chat history, meme photos—it almost certainly uses a database to hold them. If we want to store persistent data in our applications, we will likely need to use one too. In this workshop, we will learn more about what databases are, what varieties they come in and where they physically exist, and then dive into setting up our own using MongoDB and storing some data in it

Goals

  • Understand what a database is and why we use it
  • Understand the difference between SQL and no-SQL databases
  • Set up and connect to our own MongoDB database

Recommended Preparation/Readings

  • Download MongoDB Community Server here
  • Readings:
  • https://www.lifewire.com/databases-for-beginners-1019643

Registration Link

https://forms.gle/62PhWcTgxMiD3uSa8
Coming soon!

Workshop 8 — Web Testing and Debugging

Overview

One of the most important parts of writing software is making sure that it actually works; tests are our way to verify that. Testing, in the context of software development, is code we write to ensure that the code other code we write works as expected. In this workshop we will learn how to use a library called Jest to write tests for our web code, as well as other useful strategies for debugging

Goals

  • Understand why tests are useful when programming
  • Learn about various options for testing JavaScript code
  • Learn how to use Jest for testing JS code and integrate it into your project
  • Learn about what you can do with the web console

Recommended Preparation/Readings

  • None

Registration Link

https://forms.gle/pMfStieCfjSGAvWv5
Coming soon!

Workshop 9 — Project Deployment

Overview

While it is fun to test out our personal projects on our own computers, eventually we may want to reach a broader audience; to do so, we will need to deploy our project to the web. In this workshop, we will learn how to compile our React projects for production and how to host our frontends and backends on the web for others to access

Goals

  • Understand what project deployment is and how it differs from local testing
  • Learn how to acquire a domain and host our frontend at its address
  • Learn about options for hosting our backend and start setting it up

Recommended Preparation/Readings

  • None

Registration Link

https://forms.gle/F3zf3CA77LUGTyS16
Coming soon!

Workshop 10 — Participants' Choice!

Overview

This workshop is up to you, the participants! We want this week's topic to be something that you find fun and interesting, so go ahead and vote on the topic using the link below! We will do our best to tie each topic into your full-stack learning journey, making it easy for you to integrate it into your projects should you choose to do so. Try to vote as early as possible so your choice is considered!

Goals

  • Advance learning in a fun elective topic!

Recommended Preparation/Readings

  • To be determined

Registration Link

https://forms.gle/3goRDNNbbnxrXd5z8
Coming soon!

How should I prepare?

Each workshop has a small homework element (outlined above) to be completed beforehand, which will typically include brief readings and/or software to download. Don't worry, you won't be graded! But we do recommend you try your best to complete these to learn and understand as much as possible from each session

How do I join?

Registration for the full-stack series is open on a rolling basis. While any Oasis participants (and even non-participants!) are welcome to join as many or as few as you wish, we do ask that you fill out a pre-registration form for each one so we can gauge attendance. To stay updated with all Oasis news, including reminders for upcoming workshops, click the button below!