John Mangel, Developer in Santa Barbara, CA, United States
John is available for hire
Hire John

John Mangel

Verified Expert  in Engineering

Full-stack Developer

Santa Barbara, CA, United States

Toptal member since July 7, 2022

Bio

John is an adaptable full-stack engineer and an efficient communicator who started as an intern in web development at Tesla. He continued his career at AppFolio, advancing quickly to senior software engineer and tech lead due to his initiative, mentorship, project leadership, and promotion of agile practices. John enjoys working on fast-paced, user-facing projects in sustainability and global wellbeing.

Portfolio

Korda Institute for Teaching
React.js, Ruby on Rails, Heroku, Educational Portals, Education, HTML, CSS...
AppFolio
React.js, JSON API, Ruby on Rails, MySQL, HTML, Full-stack, GitHub, JavaScript...
AppFolio, Inc.
JavaScript, Ruby on Rails, React.js, MySQL, HTML, CSS, Agile Development...

Experience

Availability

Part-time

Preferred Environment

MacOS, React, JavaScript, TypeScript, Ruby on Rails (RoR), ECMAScript (ES6)

The most amazing...

...project I've worked on is leading a team with three other software engineers to streamline and automate the dispatch of vendors for tenant maintenance requests.

Work Experience

Full-stack Developer

2022 - PRESENT
Korda Institute for Teaching
  • Expanded an existing, basic web app for educators to plan projects to add functionality such as creating multiple project plans, sharing them with other users, duplicating, archiving, and deleting.
  • Added documentation for the release process on Heroku of the Rails API and the React client.
  • Added automated emails using Action Mailer and SendGrid.
Technologies: React.js, Ruby on Rails, Heroku, Educational Portals, Education, HTML, CSS, PostgreSQL, Database

Senior Software Engineer and Tech Lead

2017 - 2020
AppFolio
  • Led a team of three software engineers to streamline dispatching vendors for tenant maintenance requests and improve communication between the dispatchers and the tenants.
  • Collaborated with an agile development team to build corporate accounting into the existing accounting system, allowing property managers to manage their corporate accounting with the accounting for the property owners in a separate set of books.
  • Managed a team of three software engineering interns to develop a new budgeting page that created annual budgets more quickly, with better ease-of-use and predictive suggestions based on past budgets and future accounting projections.
  • Developed an app that suggests rental price changes based on demand, vacancies, and comparable properties together with my team. Worked closely with beta customers to iterate quickly.
  • Trained and mentored several new software engineers and interns on agile practices and cross-functional structure, working closely and keeping weekly touch points with direct reports to promote individual growth and team collaboration.
  • Collaborated with the Agile development teams to flesh out projects, prioritize development, iterate on products, and solve customer problems.
  • Converted (and expanded on) existing server-side rendered pages from full-stack Ruby On Rails to a React frontend built on a Rails backend API.
Technologies: React.js, JSON API, Ruby on Rails, MySQL, HTML, Full-stack, GitHub, JavaScript, AWS, APIs, Management, Mentorship, CSS, CSS, Bootstrap, Reactstrap, Web Development, API Integration, JSON, Ruby, ECMAScript (ES6), SQL, Technical Leadership, Team Leadership, Database, React.js

Software Engineer

2017 - 2019
AppFolio, Inc.
  • Developed an app that suggests rental price changes based on demand, vacancies, and comparable properties together with my team. Worked closely with beta customers to iterate quickly.
  • Trained and led a team of three software engineering interns to develop several new functionalities in an agile development environment, including allowing grouped rental applications for groups of housemates.
  • Collaborated with the agile development teams to flesh out projects, prioritize development, iterate on products, and solve customer problems.
  • Converted and expanded on existing server-side rendered pages from full-stack Ruby on Rails to a React front end built on a Rails back-end API.
Technologies: JavaScript, Ruby on Rails, React.js, MySQL, HTML, CSS, Agile Development, Full-stack, GitHub, Mentorship, CSS, APIs, Python, Bootstrap, Reactstrap, Web Development, Heroku, JSON, Ruby, ECMAScript (ES6), SQL, Database, React.js

Software Engineering Intern

2016 - 2016
Tesla
  • Developed a pair of internal, mobile-hybrid apps to request and manage loaner vehicle reservations for the service department.
  • Maintained and updated the internal data reporting apps using R.
  • Developed the data monitoring dashboards for the service department using Meteor.
Technologies: JavaScript, Vue.js, Node.js, Apache Cordova, MongoDB, Meteor, R, HTML, Full-stack, GitHub, CSS, Web Development, Express.js, JSON, ECMAScript (ES6), Database

Tutor

2012 - 2016
Freelance
  • Tutored five high school students in various subjects, primarily Spanish and calculus, over several years during my time in high school and college.
  • Taught a family of two high school siblings several times a week for two school years in Spanish, calculus, and science and received other clients by referral from them.
  • Educated a high school senior in Spanish to prepare and pass his AP Spanish exam, earning himself college credit through the AP program.
Technologies: Tutoring, Spanish-English Translation, Data Science, Chemistry

In-playlist Search Companion for Spotify

A pure front-end (i.e., no hosted server) PWA for web, Android, or iOS that allows a user search functionality not present in Spotify's clients and provides convenience features for existing Spotify functionality.

The main use case is to search through all of the current user's saved playlists to find those that contain a specific song, artist, album, or playlist name or description. Stores previously loaded playlists in IndexedDB for faster loading, offline access, and the ability to restore old playlist snapshots. Also allows directly playing a playlist from a specific song, optionally on a specific device, and saving a copy of that playlist or an old snapshot.

It uses Spotify Web API, TypeScript, React, React Router v6, react-bootstrap, PKCE authorization, IndexedDB, and `bottleneck` library,

SongScaler

https://jmangel.github.io/SongScaler/
SongScaler is a React-based PWA and mobile-installable web app with TypeScript. As the sole developer, I built it as a personal project for musicians learning music theory to help analyze and play complex songs. The app is front-end only and works offline once installed from the browser.

Stocks App for Google Sheets

A personal, simple, JavaScript-based script to periodically scrape certain stock data points from specific websites for given equities and write them into a Google spreadsheet using Google Sheets API.
2013 - 2017

Bachelor's Degree in Computer Science and Linguistics

University of California, Santa Barbara - Santa Barbara, CA, USA

Libraries/APIs

React.js, JSON API, Node.js, CSS, Reactstrap, React.js, Vue.js, Google Sheets API, Spotify API

Tools

GitHub

Languages

JavaScript, HTML, ECMAScript (ES6), TypeScript, CSS, Ruby, SQL, R, Python

Frameworks

Ruby on Rails, Bootstrap, Express.js, React-Bootstrap

Storage

JSON, MySQL, Database, MongoDB, PostgreSQL, IndexedDB

Paradigms

Management, Agile Development, Database Design

Platforms

MacOS, Meteor, AWS, Heroku

Other

Mentorship, Web Development, Data Structures, Algorithms, Full-stack, APIs, API Integration, Technical Leadership, Team Leadership, Apache Cordova, Web Development, Legacy Code, Progressive Web Applications (PWAs), Tutoring, Spanish-English Translation, Data Science, Chemistry, Educational Portals, Education, Authorization

Collaboration That Works

How to Work with Toptal

Toptal matches you directly with global industry experts from our network in hours—not weeks or months.

1

Share your needs

Discuss your requirements and refine your scope in a call with a Toptal domain expert.
2

Choose your talent

Get a short list of expertly matched talent within 24 hours to review, interview, and choose from.
3

Start your risk-free talent trial

Work with your chosen talent on a trial basis for up to two weeks. Pay only if you decide to hire them.

Top talent is in high demand.

Start hiring