Lambda Labs has been an absolute wonderful experience and I couldn't have asked for a better team to work with.
The last week of our project was all about polishing and getting the app finalized. Last week I thought that this would be a pretty easy week. I was surprised as we went through the week there was more and more work to complete. They either seemed to be small styling issues or a realization that we should have written an entire part of the app another way. I guess that just comes with writing version 1.0 of an app. Just need to get something out the door and then build on it.
This week the big item I worked on was setting up our app to disabled the add team member button or save button when editing a team member if the phone number isn't a full 10 digit number. Due to the way I had originally setup the phone number format it I wasn't able to do the validation of the number on the front end. I did enjoy writing the following regex to disable the button if no required phone number was present.
let addDisabled = false;
if (
/^$/gm.test(this.state.teamMember.phoneNumber) === true ||
(/\+1 \(\d{0}/gm.test(this.state.teamMember.phoneNumber) === true &&
/^\s*(?:\+?(\d{1,3}))?([-. (]*(\d{3})[-. )]*)?((\d{3})[-. ]*(\d{4})(?:[-.x ]*(\d+))?)\S*$/gm.test(this.state.teamMember.phoneNumber) === false)
) {
addDisabled = true;
}
The first part checks to see if the phone number string is empty and if so disabled will be true. The second part checks for the form string to be there but empty. The last one checks that all 10 digits have been entered.
I'm sure there is an easier way to do this and may go back to it later to simplify and get proper phone validation on the front end. Alex was able to get validation for the phone number on the backend so that when they are sent to Twilio it doesn't crash our server.
This last week had it's challenges. Looking back though I have a feeling what we experienced was pretty common. We felt really good going into the week and during the week it just felt like one thing after another was cropping up. From styling issue caused by a mix of Material-UI and Styled Components to changing a component key to something that wasn't original that caused a list item to duplicate. I will say that is the first time when mapping over an array a key causing an issue. I think mostly because I either forget to add a key and ignore the warning or the item I'm mapping over includes an id, which this one didn't.
Looking back over the last 5 weeks I'm extremely proud of the work our team put in to making this app. Many learning experiences from reading others code the entire planning process for an application of this scale.
Thanks to Nate for our apps amazing video.
GitHub PR's
Code cleanup
#155
Cleared all notifications in console and on the yarn start.
Chrome dev tools audit: 100% Accessibility, 100% SEO, 93% Best Practices
Profile pricing & restricted pages
#144
Updated pricing page and pages that are restricted when logged out such as https://trainingbot-dev.netlify.com/home/
Pricing page & phone number regex
#137
Forgot to create a new branch for these.
- Landing page links to pricing page.
- Pricing page includes a basic chart
- When adding a phone number to a new team member the add member is disabled until a valid number is entered or none is added.
- When editing a team members phone number the save button is disabled unless a valid number is entered or none at all
GitHub Repo
training-bot
/
labs11-trainingBot-FE
Front-end repo for Training Bot, an app that allows training managers to send employees automated messages.
Training Bot
| A single page application using the Twilio API to send automated text and email notifications. Training Bot assists team leaders by sending automated notifications with custom content to their team |
Demo
Here is a working live demo: https://trainingbot.netlify.com
Site
Dashboard
The central location of our App. Here you can see all of your team members, training series, and outgoing/sent messages.
Team Members
You'll store all of your members here. This information will be used to send the notification to that specific member.
Training Series
Training Series contains all of your content and assigned members.
Profile
The profile section is where you can view/delete your account as well as upgrade your account.
Mobile support
Training Bot is compatible with devices of all sizes and all OS's.
Development
- Fork the repository
- Create a new branch (
git checkout -b improve-feature) - Make the appropriate changes in the files
- Add…
training-bot
/
labs11-trainingBot-BE
Back-end repo for Training Bot, an app that allows training managers to send employees automated messages.
💬 Training Bot API 💬
Introduction
Training bot allows managers of teams to send notifications to their teammates on a predefined schedule.
Table of Contents
- 💬 Training Bot API 💬
- Overview
- Usage
- Database Tables
- Endpoints
-
🖥 Data requests and responses 🖥
/api/auth/api/users/:id/api/users/:id/training-series/api/users/:id/team-members/api/training-series/api/training-series/:id/api/training-series/:id/posts/api/posts/api/posts/:id/api/team-members/api/team-members/:id/api/team-members/assign/api/team-members/assign/:id/api/stripe/api/stripe/unsubscribe
Overview
What is Training Bot? 🤖
Training Bot is a learning application that lets a team leader create a series of trainings and deliver them at a scheduled time via text or email to assigned learners. The user will be able to add members and assign them to a scheduled set of trainings with a start date. Each training will have a title, text body, and link. They should be small…
Top comments (0)