Nate Jensen - V School | Better Humans, Better Outcomes

Sign in Subscribe

Nate Jensen

Deploying MERN App to Heroku (using your Git Master Branch & MongoDB Atlas)

As of November 10, 2020, mLab will be shutting down its services. If you need to migrate your database to use Atlas from mLab, you are strongly recommended to use their tool to migrate to Atlas. Click here for instructions. The rest of the tutorial has been updated to integrate

Zoom - Getting Started

Zoom - Getting Started

Collaborating through zoom, slack, and other digital channels is likely be a daily (if not hourly) event during your time at V School and in your career afterwards. While these tools are meant to be user friendly they also provide a lot of options and workflows that can seem confusing

Rock The Vote - Level 6

Rock The Vote - Level 6

You are going to create a full stack application with user authentication created with Node, React, Express, Mongoose & Mongodb that allows users to post and upvote or downvote political issues. This assignment has the most difficult requirements of any at V School. Ask around and find or make a friend

React Props

Introduction React is composed of Components that represent parts of the UI that the user interacts with. When you are first learning react, it can be hard to see the similarity between components and regular javascript functions when in fact they are basically the same thing! Functions in javascript set

React Hooks

React has come a long way since its beginning back in May 2013 when it was made open source. While the core concepts of the framework have remained the same, the implementation is always improving to help developers like yourself easily set up a SPA application. Features like State and

Webpack - Bundling Frontend & Fullstack React Applications.

Webpack - Bundling Frontend & Fullstack React Applications.

What is Webpack? Webpack is a module bundler we can use to bundle our Node projects, such as any app you have been making in React. When you write applications using Node you are essentially writing modules every time you create a new file. Webpack takes all of these modules

Rolling Dice with React State

Rolling Dice with React State

Using what you have just learned about state in React, you are going to create a component that renders 5 dice numbers for the user to view. You Must 1. Create a class component called 2. Write a method in that class that produces 5 random numbers between

Jest : Your First Test

Jest is an awesome testing library maintained by employees at facebook and open source contributions. Jest is used for running tests on your code. It both runs your tests and provides the methods needed to write the tests. Jest Documentation Installation To install jest, create a package.json file in

Error Bound( ries )

Error Bound( ries )

Before doing this assignment, make sure you have read our write up on ErrorBoundary components. That article can be found here. CD into your assignement folder and run the following command to clone, remove the .git, install dependencies, and open the assignment in VS Code. git clone git@github.com:

React Error Boundaries

React Error Boundaries

Error Boundaries in React help us face a few error handling issues head on. The first issue it helps us with is thrown errors. If an error is thrown inside of a React app, it is likely that part or all of the App will crash leaving you with nothing

Render Probs...

Render Probs...

Before taking on this debugging challenge, make sure to read our article on render props or this is likely to not make much sense! - Render Props You have been given a small application from a co-worker who is trying to learn how to use render props. They tell you

Changing Themes using Context

Changing Themes using Context

Using what you have just learned about React Context, you are tasked with making a ThemeProvider context for a new application. Your goal is build a home page that offers a dark and a light theme. This theme can be toggled by the user. This will be excellent practice in

Transitions with react-transition-group

This article is intended to help you build meaningful transitions into your applications. While it is extremely easy to overdo it with animations and transitions, they can also add a professional feel when done correctly. This article will use the react-transition-group module. Note: Each of the components provided by this

Deploying your MERN project with Heroku (using your Master Git Branch)

Deploying your MERN project with Heroku (using your Master Git Branch)

Heroku is an excellent service that specializes in making deployment of your web application quick and painless. Fortunately for us, it also has a free tier that will be perfect for our needs. There will only be a little bit of setup needed to get your web app up and

HTTP and the Internet

HTTP and the Internet

In this article we will be going over the basics of HTTP, along with how information is passed around the web between web servers and web browsers. This is important because a program or website's ability to maintain information is due to it being able to request and save information

Redux Contacts (React)

Redux Contacts (React)

Build a contact management system using Redux in React. Your redux store will be in charge of maintaining and updating your contact list. You will create actions that when sent to the reducer: * add a new user to an array of contacts * delete an existing user from the array The

Demystifying REGEX

Demystifying REGEX

A Regular Expression is simply a sequence of characters that define a search pattern. Regular expressions can be given to languages like Javascript to have it search a string for matches to the regular expression pattern. This article is an introduction to regular expressions and some of their practical uses.

Set Timeout and Set Interval

Set Timeout and Set Interval

setInterval and setTimeout are two of the higher order functions in Javascript. Higher order functions take a function as one of their arguments like we see below: setTimeout(function(){}); setInterval and setTimeout provide a way for you to tell your program to run a function or evaluate an expression after