Full Stack Web Developer to Implement a Design and Create a Progressive Web Application
Budget: $250 – $750 USD
Full Stack Web Developer to Build Progressive Web application for Handyman.
MERN Stack
Mongo
Express
React
Node
MINIMUM LIGHTHOUSE METRICS FOR ACCEPTANCE:
PERFORMANCE 90+
ACCESSIBILITY 90+
BEST PRACTICES 100
SEO 95+
PWA INSTALLABLE AND OPTIMIZED
First Contentful Paint
<0.7 s
Time to Interactive
<1.5 s
Speed Index
<0.9 s
Total Blocking Time
<80 ms
Largest Contentful Paint
<1.0 s
Cumulative Layout Shift
<0.052
No console errors.
Fewer than three issues.
General Guidelines:
Please write clean code.
Make sure future developers can navigate with ease. For example, explain code where it might be necessary.
Do lots of Git pushes. Seasoned engineers push often!
Story:
I’m a handyman who needs a good web app for my business.
I have an intelligent website design that will serve as the baseline for the front end.
The UI makes it easy to book me for various handyman tasks and allows users to rent tools and look up manuals for popular appliance manufacturers.
Need pages for customer referrals, a privacy policy, a user agreement, and a rental agreement page.
I need a service area charge to be billed according to my map.
I currently have a free domain and site from Google that I have been using. The current site is https://best-handyman-ever.business.site/?m=true.
The site uses Koalendar (koalendar.com), which integrates with Stripe to book appointments and checkout.
I have a redirect from the domain besthandymanever.com (a Google domain).
The plan is to implement the new design, add a few functions, and turn the redirect the other way, pointing toward www.besthandymanever.com
Best Handyman Ever Logo colors:
• #414141 Grey shade
• #f8981d Orangish shade
Gallery
Objectives:
• Make the “view all projects” link functional.
• Pull images from the google drive folder labeled “best handyman ever web images”
• Serve images in next-gen formats and otherwise optimize load times.
Testimonials
My customers say…”
Group 4
Objectives:
• Create a left and right-scrolling viewer that updates with new reviews. i.e., pull from Google reviews and TaskRabbit.
Google https://g.co/kgs/McTQkc
TaskRabbit https://www.taskrabbit.com/profile/augustino-p
Supplemental:
• Using the supplied word document, insert the customer reviews with the date and name into the viewer.
Book Appointment
Group 514
Objectives:
• Create the calendar within an iframe or something that keeps the user on this site
• Create a reactive calendar that will take customers to the booking page for their specific task.
Electrical tasks book for electrical, plumbing tasks book for plumbing, etc.
• Create a checkout page integrated into the calendar wherein the customer can pick a date, time and allotment on the appropriate calendar for their task and checkout.
o The way it currently works almost does what we need to but does not include service area charges which need to be included.
Background:
Not all calendars are the same. For example, some tasks have different allotments for time; some have different availability, charge different rates, etc.
Considerations:
The calendars will need to be integrated with service area charges.
Service area charges are as follows and are Stripe products that are mandatory for each booking.
Blue Ring $5 Product link https://book.stripe.com/fZeg1W9Tvcom8taeVJ
Green Ring $25 Product link https://book.stripe.com/28og1W9TvbkibFmbJr
Pink Ring $45 Product link https://book.stripe.com/dR69Dy7Ln0FEgZGfZG
Red Ring $60 Product link https://book.stripe.com/14kg1WghTage4cUdRA
Black Ring $75 Product link https://book.stripe.com/00g9Dy4zbgEC38QfZJ
Yellow Ring $85 Product link https://book.stripe.com/7sIcPKaXz74210I00M
MERN Stack
Mongo
Express
React
Node
MINIMUM LIGHTHOUSE METRICS FOR ACCEPTANCE:
PERFORMANCE 90+
ACCESSIBILITY 90+
BEST PRACTICES 100
SEO 95+
PWA INSTALLABLE AND OPTIMIZED
First Contentful Paint
<0.7 s
Time to Interactive
<1.5 s
Speed Index
<0.9 s
Total Blocking Time
<80 ms
Largest Contentful Paint
<1.0 s
Cumulative Layout Shift
<0.052
No console errors.
Fewer than three issues.
General Guidelines:
Please write clean code.
Make sure future developers can navigate with ease. For example, explain code where it might be necessary.
Do lots of Git pushes. Seasoned engineers push often!
Story:
I’m a handyman who needs a good web app for my business.
I have an intelligent website design that will serve as the baseline for the front end.
The UI makes it easy to book me for various handyman tasks and allows users to rent tools and look up manuals for popular appliance manufacturers.
Need pages for customer referrals, a privacy policy, a user agreement, and a rental agreement page.
I need a service area charge to be billed according to my map.
I currently have a free domain and site from Google that I have been using. The current site is https://best-handyman-ever.business.site/?m=true.
The site uses Koalendar (koalendar.com), which integrates with Stripe to book appointments and checkout.
I have a redirect from the domain besthandymanever.com (a Google domain).
The plan is to implement the new design, add a few functions, and turn the redirect the other way, pointing toward www.besthandymanever.com
Best Handyman Ever Logo colors:
• #414141 Grey shade
• #f8981d Orangish shade
Gallery
Objectives:
• Make the “view all projects” link functional.
• Pull images from the google drive folder labeled “best handyman ever web images”
• Serve images in next-gen formats and otherwise optimize load times.
Testimonials
My customers say…”
Group 4
Objectives:
• Create a left and right-scrolling viewer that updates with new reviews. i.e., pull from Google reviews and TaskRabbit.
Google https://g.co/kgs/McTQkc
TaskRabbit https://www.taskrabbit.com/profile/augustino-p
Supplemental:
• Using the supplied word document, insert the customer reviews with the date and name into the viewer.
Book Appointment
Group 514
Objectives:
• Create the calendar within an iframe or something that keeps the user on this site
• Create a reactive calendar that will take customers to the booking page for their specific task.
Electrical tasks book for electrical, plumbing tasks book for plumbing, etc.
• Create a checkout page integrated into the calendar wherein the customer can pick a date, time and allotment on the appropriate calendar for their task and checkout.
o The way it currently works almost does what we need to but does not include service area charges which need to be included.
Background:
Not all calendars are the same. For example, some tasks have different allotments for time; some have different availability, charge different rates, etc.
Considerations:
The calendars will need to be integrated with service area charges.
Service area charges are as follows and are Stripe products that are mandatory for each booking.
Blue Ring $5 Product link https://book.stripe.com/fZeg1W9Tvcom8taeVJ
Green Ring $25 Product link https://book.stripe.com/28og1W9TvbkibFmbJr
Pink Ring $45 Product link https://book.stripe.com/dR69Dy7Ln0FEgZGfZG
Red Ring $60 Product link https://book.stripe.com/14kg1WghTage4cUdRA
Black Ring $75 Product link https://book.stripe.com/00g9Dy4zbgEC38QfZJ
Yellow Ring $85 Product link https://book.stripe.com/7sIcPKaXz74210I00M