A Little About Me
I've been developing web solutions since 2009 and I can't imagine myself in any other profession. The ever changing nature of the field is what makes it so much fun. I love learning new things in web development and it's always a great feeling when you build something brand new or solve a complex problem and you feel like you've moved up a skill level.
My passion is helping people solve unique problems with high-performing solutions. This work ranges from small to large scale while incorporating both front end and back end technologies. I have extensive experience with HTML, CSS, JavaScript/jQuery, API integration, accessibility (WCAG and Section 508), responsive development, single-page applications, various libraries and frameworks and more. In addition to my front end expertise, I also have experience building solutions server-side with PHP, ASP and MySQL.
I am a huge advocate for building/improving efficiencies and creating effective workflows. I am very detail-oriented, responsive and take quality work very seriously. I have won several awards for innovation and excellence while also leading a small team of very talented web developers.
When I get the chance to get away from the computer, I enjoy mountain biking, skiing, camping, traveling and automotive building/restoration. I was recently fortunate enough to take a trip out and hike the Grand Canyon. That is an experience that I recommend to everyone! It's great to have those opportunities where you can turn off the computer and the cell phone and just let your day-to-day life go!
Education
-
Master of Arts
Indiana University of Pennsylvania August 2010 - August 2011
Adult Education and Communications Technology Program
4.0/4.0 GPA, Graduated with high honors
-
Bachelor of Science
Indiana University of Pennsylvania June 2009 - August 2010
Communications Media - Web Development
4.0/4.0 major QPA, Graduated with honors
-
Associate of Applied Arts
Pennsylvania College of Technology August 2003 - May 2006
Mass Media Communications - Video Production
Expertise
- HTML
- CSS
- JavaScript
- jQuery
- JSON
- AJAX
- webpack
- Babel
- SASS/SCSS
- Git
- GitHub/GitLab
- Firebase
- jQuery UI
- ASP
- Adobe Creative Suite
- Wordpress
- AngularJS
- PHP
- MySQL
- REST APIs
- Google Analytics/APIs
- Team Leadership
- Accessibility
- JSONP
- Web Standards
- npm
- Cross-browser Compatibility
- Cypress
- Client Services
- Talent Management
- Node.js
- Responsive Web Development
- HTML Semantics
- OOP
- Technical Troubleshooting
- Web Content Accessibility Guidelines
- Section 508
- React
- Next.js
- TypeScript
- Jest
- React Testing Library
- Python
- MAMP
- Accessibility Remediation
- VoiceOver
Work Experience
-
Senior Front-End Engineer
CivicActions October 2022 - Present
Remote
Front-end engineer on Centers for Medicare & Medicaid Services’ (CMS) Provider Data Catalog (PDC) application. Focus on improving the user experience of the application through rich accessibility and application improvements based on user feedback. Execute features using Storybook to build UI components, React, Webpack, E2E testing with Cypress and unit testing with React Testing Library and Jest. Conduct weekly site release demos for Provider Data Catalog (PDC) Care Settings teams and answer questions and provide additional information as needed. Communicate and coordinate directly with Provider Data Catalog (PDC) stakeholders on a daily basis. Manage all code and reviews via Git and GitHub. Schedule and manage work/tasks via Agile methodology through Jira and Confluence for supporting information. Work directly with other developers, designers, producers and other team members on a daily basis.
Also provide front-end support for Centers for Medicare & Medicaid Services’ (CMS) Medical Billing Rights (MBR) application as a React SME.
-
Senior Software Engineer
PowerSchool April 2022 - September 2022
Remote
Front-end engineer on PowerSchool's Unified Classroom Behavior Support application. Focused on improving the user experience of the application. Executed features using React with MobX for state management, TypeScript, Webpack and unit testing with React Testing Library and Jest. Built API's via AWS CDK using API Gateway, Lambda's, etc. Managed all code and reviews via Git and GitHub. Scheduled and managed work/tasks via Agile methodology through Jira and Confluence for supporting information. Worked directly with other developers, designers, producers and other team members on a daily basis.
-
Senior Developer
Last Call Media April 2021 - April 2022
Remote
Full-stack developer on Team X with four other full-stack developers. Developed custom features for the Paid Family and Medical Leave portal for the state of Massachusetts. Executed features using React, Next.js and TypeScript for the front-end and Python, Postgres and SQLAlchemy for the back-end. Tested all code using Jest, React Testing Library and pytest. Managed all code and reviews via GitHub. Wrote GitHub workflows to automate formatting, linting, testing, deployment, etc. Scheduled and managed work/tasks via Agile methodology through Jira and Confluence for supporting information. Worked directly with other developers, designers, producers and other team members on a daily basis. Participated in weekly technical decision meetings with a committee of other developers. Participated in Team X standups and retrospectives on a daily/weekly basis.
-
Senior Manager, Web Development
Blackboard May 2019 - April 2021
Remote
Lead a team of five front-end web developers while also maintaining high performance as a front-end web developer across multiple products within a global SaaS company.
Development:
Develop custom, responsive web solutions using HTML, CSS, JavaScript/jQuery, JSON(P), REST API’s, Git, various libraries and frameworks and more. Ensure that all solutions are developed and maintained for accessibility based on the latest Web Content Accessibility Guidelines (WCAG) and requirements of Section 508. Engineer solutions with object-oriented programming for optimal organization, performance, usability and scalability. Collaborate and work cross-functionally to scope, plan, and execute development projects to exact specifications. Create and continuously improve development and workflow efficiencies as tools, technologies and markets evolve. Work closely with other Creative developers to share knowledge and experiences to ultimately grow and excel collectively.Management:
Oversee execution of development projects and scheduling of service delivery. Exercise performance management, professional development and coaching of team. Interview, hire, train and coach new employees. Ensure services and products delivered exceed industry standards. Track client satisfaction (CSAT) and execute change where required to reflect higher, more positive results. Exercise effective communication with internal and external clients. Scope and quote all Creative development projects. Schedule and execute monthly team touchpoint and one-on-one meetings. Participate in pre-sales initiatives, revenue projections, internal cross-functional meetings and initiatives and more. Create new products and services that generate new revenue streams. -
Manager, Web Development
Blackboard April 2014 - May 2019
State College, Pennsylvania / Remote
Lead a team of seven front-end web developers while also maintaining high performance as a front-end web developer for the K12 platform.
Development:
Develop custom, responsive web solutions using HTML, CSS, JavaScript/jQuery, JSON(P), REST API’s, Git, various libraries and frameworks and more. Ensure that all solutions are developed and maintained for accessibility based on the latest Web Content Accessibility Guidelines (WCAG) and requirements of Section 508. Engineer solutions with object-oriented programming for optimal organization, performance, usability and scalability. Improve development and workflow efficiencies as tools, technologies and markets evolve. Work closely with other Creative developers to share knowledge and experiences to ultimately grow and excel collectively.Management:
Oversee execution of development projects and scheduling of service delivery. Exercise performance management, professional development and coaching of team. Interview, hire, train and coach new employees. Ensure services and products delivered meet or exceed industry standards. Track client satisfaction (CSAT) and suggest improvements to reflect higher, more positive results. Exercise effective communication with internal and external clients. Scope and quote all Creative development projects. Schedule and execute bi-monthly one-on-one meetings with team members. Participate in revenue projections, internal cross-functional meetings and initiatives and more. Create new products and services that generate new revenue streams. -
Web Developer II
Schoolwires (Blackboard) July 2013 - April 2014
State College, Pennsylvania
Develop custom, responsive web templates and applications for K12 school districts using the most modern development techniques involving HTML, CSS, and JavaScript/jQuery. Migrate school district website templates from Centricity1 platform to Centricity2 platform. Develop, configure, and manage predesign template projects. Manage hourly projects as well as client-designed template projects. Participate in interviewing and hiring new web developers. Developed Schoolwires corporate website with 12 custom applications and four custom jQuery plugins. Mentor junior team members and help train new hires. Exercise effective communication with clients and employees of Schoolwires. Research and implement new web development technologies and techniques and share them with the development team. Participated in a six-session Project Management class offered by the Pennsylvania State University.
-
Web Developer I
Schoolwires (Blackboard) May 2011 - July 2013
State College, Pennsylvania
Develop custom web templates for K12 school districts using the most modern development techniques involving HTML, CSS, and JavaScript/jQuery. Migrate school district website templates from Centricity1 platform to Centricity2 platform. Develop, configure, and manage predesign template projects. Manage hourly projects as well as client-designed template projects. Participate in interviewing new web developers. Exercise effective communication with clients and employees of Schoolwires.
Work Samples
Here is a small collection of some of my most exciting work samples. I chose a variety of projects that cover a wide range of skills and experience. Click on an item to open the project detail window.
-
Portfolio Website Rebuild
I'm very excited to showcase my new portfolio website! I designed this single-page site myself with several major focus points: accessibility, responsive and modern UI and fresh updated content and project samples. The parallax effects are developed with a mixture of custom JavaScript and the Animate.css library for lightweight effects. The accessibility features like the High Contrast Mode toggle, _blank target link warning tag, custom focus ring and ARIA usage help to illustrate my extensive knowledge and application of web accessibility.
I custom developed this site with HTML, SCSS, object-oriented ES6 and used Head.js for some browser detection. I used npm to manage the project and all its dependencies and webpack to compile the SCSS and ES6 code. Babel (babel-loader) was used to compile the JavaScript and sass-loader to compile the SCSS. I also added an auto-prefixer with PostCSS and postcss-loader. Finally, I used nodemon for file watching for ease of use given that I set up multiple webpack configs for multiple file output locations. I used Git for version control and GitLab to host the repository as well as the site itself using CI/CD for GitLab Pages.
See the Project
-
WCM Integrated Staff Directory Application
The Blackboard K12 Web Community Manager Product team was in need of a new staff directory application that directly integrates with the Blackboard Communications directory solution. The application also required a method of sending secure emails to listed staff members along with maintaining an overall similar structure and feel to the existing Blackboard Communications directory solution.
I wrote the entire development scope and quote for the project. Once approved, I began by planning the individual, manageable pieces of the application. I developed and tested each piece and wrapped with a full scale responsive and accessible staff directory solution.
The application was custom built with HTML, CSS, object-oriented JavaScript and several Blackboard Communications API endpoints. It was built with a focus on accessibility, support for mobile devices and integrated with server-side tools for sending emails and ReCaptcha validation. The application was developed inside Web Community Manager's integrated development environment and tracked and managed via Jira and Confluence. I worked cross-functionally on this project with the WCM Product team.
See the Project
-
Page Builder Application
The Page Builder application is a complex yet flexible application built using an extensive web builder framework. It is built for and used inside Blackboard's K12 CMS, Web Community Manager (WCM). It greatly extends content management functionality and possibilities by allowing users to build a wide range of structures and types of content that are both responsive and accessible. The Page Builder app can be used to build small single bits of content or complete, full pages of various structures, layouts and types of content like simple HTML headings, accordion's, video embeds, tabbed widgets, social media sharing buttons, image galleries and much more. It's even possible to edit content at each supported mobile viewport in Web Community Manager (768, 640, 480, and 320) as well as style each individual component using Style Manager. There's an endless range of possibilities offered in the Page Builder app.
The application was developed with object-oriented JavaScript along with a highly customized implementation of GrapesJS as a base. All content blocks were custom developed with styling and trait options built and/or applied. The application also launched with 11 custom plugins built using grapesjs-cli. I built the Page Builder core as a jQuery plugin for portability, easy CDN hosting, simple implementation into other custom WCM applications and support for instantiating multiple instances of the app on a page if necessary. I used Git for version control and GitLab to host the project within the team resources/assets.
See the Project
-
Community Engagement Resource Center Website
Blackboard was in need of a centralized website solution to publicly host help information/documentation for all K12 products and services. I wrote the entire development scope and quote and I worked cross-functionally with several other teams on the project. The Community Engagement Resource Center (CERC) website is a major resource portal for both internal and external clients and is one of Blackboard K12’s most visited websites.
I custom developed the website with HTML, CSS, JavaScript and jQuery and it was built with a focus on accessibility and support for mobile devices. I used Head.js for some browser detection. I also developed 10 custom Web Community Manager modules for various content throughout the site. The site and custom modules were built inside WCM's integrated development environment. The project was managed and tracked via Trello.
See the Project
-
Creative Kick-Off Request Application
The Creative Design team frequently schedules kick-off meetings with clients through a web-based scheduling form. The solution they were previously using was very inefficient and cumbersome in that it required updating at least every two days and sometimes even daily. The dates and meeting times were set manually and multiple bookings were a constant problem.
The most important part of the project and ultimately an incredible time saver was building automation. I custom built the application with a Firebase backend that houses all of the scheduled meetings and settings for the application. The great thing about Firebase is that it allows the UI to be updated live as meetings are scheduled and settings are updated. The application is highly configurable for administrators allowing them to set specific recurring and non-recurring time frames and it updates live in Eastern Time no matter what time zone the user is in. I used Moment.js to handle time in the application given the importance of keeping everything in the Eastern Time zone. When a meeting request is submitted, an email is sent to the configured email address(es) in the application settings notifying them of the submission. The information is sent to a custom ASP email script via JSONP as the ASP server is cross-domain.
I custom developed the application with HTML, CSS, JavaScript and jQuery. The application is responsive and is also fully accessible. I used Git for version control and GitLab to host the project within the team resources/assets.
The time savings in managing the new solution as been huge for the designers. They have reported updating the previous solution a total of five to eight hours a week. With the new solution, they have reported a total of zero to 15 minutes a week - a 95% to 100% time savings.
See the Project
-
WCM Local Development Environment
The Web Community Manager (WCM) local development environment is an application used to develop website templates outside of WCM's integrated development environment. The WCM IDE has several limitations that this project resolves. It allows Creative Developers to very quickly initialize a new template project, develop with the latest ECMAScript standard, develop with SASS, compile with webpack and build the final template zip file all from the command line.
A fellow colleague and I collaborated on this project. We developed the entire application with object-oriented PHP using classes and it runs with MAMP on localhost. It initially requests the specified WCM webpage and then executes a series of replacements and insertions to properly display locally. The application inserts the local HTML, compiled JavaScript and SCSS into the requested page. We built a caching mechanism to store the requested webpage which drastically improves application performance. There is a simple command available to clear the cache when needed.
We used npm to manage the project and all its dependencies and webpack to compile the SCSS and ES6 code. Babel (babel-loader) was used to compile the JavaScript and sass-loader to compile the SCSS. We also added an auto-prefixer with PostCSS and postcss-loader. Finally, we used nodemon for file watching for ease of use given that we set up multiple webpack configs for multiple file output locations. We used Git for version control and GitLab to host the repository.
See the Project
-
Multimedia Gallery Application
The Multimedia Gallery is a responsive media gallery that displays images and embedded videos on any device and provides top-notch accessibility for all users. It allows for any size image to be uploaded so no more strict image dimensions for a gallery. The gallery will assume the width of the container it is placed in and the height will scale proportionally for each image as the gallery transitions from one slide to another. The gallery also allows a user to manage showing/hiding titles and captions on a per-record basis as well as set up an external link while providing custom link text, link url, and link target for each record if they choose to. Embedded videos display as a popup window on the end-user website. The video popup is triggered by a customized link that the user sets up in each record. Custom video link text is provided by the user along with the iframe video embed code that the user gets from a 3rd-party provider like YouTube or Vimeo. Video’s auto play through the use of an iframe url parameter that must be included in the embed code. YouTube and Vimeo are our most popular providers and the gallery actually adds the autoplay parameter for the user if they don’t have it included. We also add the autoplay parameter for TeacherTube embeds if they aren’t provided. A user can use iframe embed code from any provider so video support is nearly endless.
The application was developed with object-oriented Javascript. The application is responsive and is also fully accessible. I built the application as a jQuery plugin for portability, easy CDN hosting, simple implementation and support for instantiating multiple instances of the app on a page if necessary. I used Git for version control and GitLab to host the project within the team resources/assets.
See the Project
-
Creative Services Image Editor
I custom built this application so that the Creative Services team can provide clients a simple solution to a recurring problem. Clients often need to crop and resize imagery for their websites and many struggle with this task given that there aren't any simple editors available with only a small set of options that they need. Ease-of-use is a huge part of this struggle.
I custom built the image editor using cropit.js as a foundation. The application resizes, crops, rotates, and mirrors. Cropit doesn't include a "mirror" option so I built it into the existing plugin. A client can set the dimensions they want to size their image(s) to and when uploaded, the user can drag the image around in the viewer to set the cropped area. The application will remember the dimensions that the user sets via a cookie. Also, when sharing the link to the application, you can preset the dimensions in the query string so the user is ready to go upon page load. The editor also supports EXIF meta data in uploaded images.
When an image is prepared for download, the image information is retrieved through the cropit plugin as a base64 data URI and converted to a Blob object which is then applied to the "Download Cropped Image" button as an "href" attribute. The download is ultimately triggered upon click via the "download" attribute on the button. I custom designed this application and developed it with HTML, CSS, JavaScript and jQuery. I used Git for version control and GitLab to host the project within the team resources/assets.
See the Project
-
Bell Schedule Application
The Bell Schedule app is a custom Web Community Manager (WCM) module. It allows a school district to provide a minute-by-minute bell schedule for their end users. The application interfaces directly with a WCM-based calendar that is set inside the app. The WCM calendar is where day types are set and the Bell Schedule app displays the day type accordingly. A configuration file is used to define a series of default day types and periods for the district to use. A custom interface is used to build and populate the config file which is then uploaded to the district website. The district can either use the default day types in the app or define and manage their own custom set of day types and periods. They can also set and utilize an A-B Day schedule instead if desired. The highlighted period text color and background color are also custom managed inside the app. One nice aspect to this app is that it is set to a specific time zone. The district can set the app to display based on the time zone that they are in. The application then displays in that timezone no matter where the end user is in the world.
I custom developed the application with HTML, CSS, object-oriented JavaScript and jQuery. Moment.js was used to set the timezone based on the setting applied inside the app. I used the WCM API to request the calendar data for the applied day types and then built the application UI based on that data. The application is responsive and is also fully accessible.
See the Project
Contact Me
- LinkedIn: https://www.linkedin.com/in/brentonskelly/
- GitHub: https://github.com/brentonkelly1982
- GitLab: https://gitlab.com/brenton.kelly
- Stack Overflow: https://stackoverflow.com/users/8068091/bsk
- Email Me