nikomakr / mak-lift Goto Github PK
View Code? Open in Web Editor NEWFinal Project of Bootcamp Front-End Developer [Real Client]
Home Page: https://mak-lift.gr
License: MIT License
Final Project of Bootcamp Front-End Developer [Real Client]
Home Page: https://mak-lift.gr
License: MIT License
End user must have an experience of a nice UI/UX with relevant content and specifications per each fleet option.
[High]
[MVP Feature, Enhancement, Other extras]
End user only sees calendar on each fleet option page!
End user can navigate from button Fleet to each of the four options and see a nice format with relevant content and specifications loading dynamically from JSON file.
Be sure you are on the right branch and npm run dev
Not needed
TBD
N/A
1)From project requirements:
2)From project proposal acceptance criteria:
3)From MVP:
Draft final project presentation, here: presentation template
[MVP features, enhancement, optimisation, documentation, UI/UX, JSON etc.]
[25/01/2024]
None
Nothing really
After we install REACT, we must follow structure of REACT in the repo.
[High]
[Task]
It's not visible to the end user the move from just one html file converting into REACT structure files.
It's not visible to the end user the move from just one html file converting into REACT structure files.
QA must check thoroughly if structured code follows REACT principles.
Not visible change. This is a REACT structural change.
html-sitemap-into-react-files-structure
N/A
Follows REACT filling structure.
N/A
[REACT]
[18/01/2024]
None
Nothing for the moment.
Create a well detailed aboutUs page that will be a brief explanation of what the company does and what it entails.
[High]
[Task]
The webpage is without an aboutUs page
A well detailed aboutUs page must be included.
Create an aboutUs page.
Nothing visible on webpage
aboutUs-page
N/A
Check if the aboutUs component is properly added to the webpage
Check if the aboutUs component has a good styling a well detailed text description.
N/A
[React]
[18/01/2024]
None
Nothing specific
Description:
Creating a contact page with forms that will allow the user send in emails when need.
Priority:
High
Type:
MVP Feature
User story -
Currently blank
User Story - Expected Behaviour:
When the contact button on the nav-bar is clicked it takes you to the page which in turn allows you to contact the company either via a form or calls or emails.
Steps to Reproduce:
not applicable
Screenshots:
none
Branch Name:
8-Contact-component
Additional Information:
[Provide any additional information, context, or suggestions that might be helpful.]
Acceptance Criteria:
Subtasks:
not applicable.
Assignees:
Leading Developer: [@Chiamaka]
Leading QA: [@shola]
Labels:
MVP
Due Date:
20/01/2024
Dependencies:
None
Notes for Reviewers:
None.
[Provide a clear and detailed description of the issue or feature request. Include the context, purpose, and any relevant background information.]
[High / Medium / Low]
[Bug / MVP Feature / Enhancement / Task]
[Describe the current behaviour or issue you are facing.]
[Describe the expected behavior or how the feature should work.]
[If it's a bug, provide detailed steps to reproduce the issue.]
[Attach any relevant screenshots to help illustrate the issue or proposed feature.]
[Provide any additional information, context, or suggestions that might be helpful.]
[Define the criteria that need to be met for this issue to be considered resolved.]
[Apply appropriate labels such as bug, enhancement, documentation, etc.]
[Optional - If there's a specific deadline or timeframe for resolving this issue.]
[List any dependencies or related issues.]
[Include any specific notes or considerations for reviewers.]
- correction on content colour respecting brand's colours
- fix image on left hand side of the content
- adjust the image we show just about the About Us content and below NavBar
- take off the logo
- CSS small tweak
Show only the options of fleet and date range when end user clicks Search & Hire
Show relevant calendar after user chose in fleet options
[High]
[Bug, MVP Feature, Enhancement]
About Us:
1)fix of bug as end user can't see image on left handside of the content
2)the photo above About Us and below NavBar show the upper side of the image only
3)the content does not follow brand's colours
Footer:
-Search & Hire:
-Header:
Missing
Be sure you are on branch: optimisations-aboutus-footer-header-search
npm run dev
Browse on About Us
Check footer at the bottom of the page
Browse on Search & Hire
Not needed
optimisations-aboutus-footer-header-search
N/A
End User see a polished About Us with homogenous colours and nicely placed images.
Also, the footer end user can find any relevant information about the business in nice format.
On Search & Hire user can choose fleet option, date range and we render the equivalent calendar.
Introduction of a header above the NavBar with brand name of Mak-Lift.
Will be added later on as further optimisations required on Search & Hire page.
[bug, enhancement, further development]
[24/01/2024]
None
N/A
Implement the Json and Api so when the user books a date to rent we calculate the cost of the number of days and the user has an option to change the currency to its preferred choice.
[High]
[Task]
The Json and Api is not implemented on the search and hire page
The Api and Json must be implemented on the search and hire page so the user can be able to hire and also make enquirers in his preferred currency.
Implement the Json and Api on the search and hire page
Nothing visible on webpage
api-implementation
N/A
Check if the user can book a tool for hire for different days and the cost is calculated.
Check if the user can also make enquires about the cost in its preferred choice of currency.
N/A
[React]
[24/01/2024]
None
Nothing specific
The business uses specific colours, which we need to follow for branding reasons. It follows the rule of 60 30 10 in percentages + specific black and white. Those are:
RED
HEX: #fe3253
RGB: (254, 50, 83)
GREY
HEX: #4D4D4D
RGB: (77, 77, 77)
BLUE
HEX: #004E74
RGB: (0, 78, 116)
*WHITE
HEX: #efe6e6
RGB: (239, 230, 230, 1)
**BLACK
HEX: #0f0202
RGB: (15, 2, 2, 1)
[Medium]
[Branding]
User must see more than 90% the colours above
Users sees on more than 90% the colours mentioned above.
N/A
Attached below the logo of the brand and other icons to be used later on.
css-logo-and-images
Those colours must be followed throughout the project and wherever there is choice for colouring.
The colours you see are from the above mentioned.
Creation of Images folder with the below logo and icons
N/A
[Branding, logo, icons]
[18/01/2024]
None
Please, use those colours and logo for anything needed.
We need to:
[High]
[Task]
Lack of REACT.
Structure of files & packages to be included
REACT can be checked on packages
Nothing visible on webpage
install-react-and-extras
N/A
Check if REACT installed, files follow right structure
Check libraries and packages such as yup, axios, tailwind, bootstrap, formik
N/A
[React]
[17/01/2024]
None
Nothing specific
We need the basics to start after we get our Project Proposal approved, here: project proposal
So, we need to create:
[High]
[Task]
We have nothing for the moment!
N/A
readme-htmlsitemap-ignore
N/A
N/A
[README.md , HTML sitemap , .gitignore ]
[17/01/2024]
[None]
[N/A]
We need to have calendar per each fleet option and consolidated one, too.
Those must be available on each fleet option page, but also on search page, too.
[High]
[MVP Feature]
Those pages and functionality doesn't exist for the moment!
User must have one page per fleet option where availability calendar will be found there.
Similarly user will see consolidated calendar with option to filter in/out on search page.
Run REACT on your local. Let me know if I cabn help you.
N/A
TBD
Code rendering in different pages. All work sits in components, where there is consolidated component of all those four availability calendars.
-User sees in fours pages of Boom, Scissor, Spider, Mount the equivalent calendars
-User sees in search page a consolidated calendar of the four above.
-User on search page sees/has option(s) of choosing one or more or all fleet options.
-User on search page sees/has option(s) of choosing specific date range or full week or full month
Nothing for the moment
MVP feature
19/01/2024
None for the moment.
I will consult Shola as he works on search
Please, be careful as calendars and search must be linked.
Consult Shola and Niko for any changes or additions.
Description:
We need to add contents to the footer of the page which must meet the below acceptance criteria.
Priority:
[High]
Type:
MVP Feature
User story - Current Behaviour:
Nothing showing on the footer
User Story - Expected Behaviour:
Should have a footer showing the address of the business, registration mailing address and copyright details.
Steps to Reproduce:
N/A
Screenshots:
none
Branch Name:
Footer Update
Additional Information:
None
Acceptance Criteria:
Styling colors must be the stated webpage colors
Should have mailing information.
Address of the company.
Copyright details.
Subtasks:
None
Assignees:
Leading Developer: [@clamadi]
Leading QA: [@d-sholaakanbi]
Labels:
MVP
Due Date:
21/01/2024
Dependencies:
None
Notes for Reviewers:
None
Create a Nav container that will be colorful and will consist of different rendered buttons to have a navbar in the webpage.
[High]
[Task]
The navbar is without a container
A colorful and suitable nav container must be included.
Create a nav container.
Nothing visible on webpage
nav-Container
N/A
Check if the nav component is properly added to the webpage
Check if the nav component has a good styling.
N/A
[React]
[React]
None
Nothing specific
Description:
We need to add contents to the Navbar of the page which must meet the below acceptance criteria.
Priority:
[High]
Type:
MVP Feature
User story - Current Behaviour:
The Navbar is having the required components but it lacks styling
User Story - Expected Behaviour:
Should have a well styled navbar on the webpage that consist of the components buttons
Steps to Reproduce:
N/A
Screenshots:
none
Branch Name:
20-nav-component-update
Additional Information:
None
Acceptance Criteria:
Styling colors must be the stated webpage colors.
Each component must be a well styled button.
The navbar components links must be functioning.
Subtasks:
None
Assignees:
Leading Developer: @d-sholaakanbi
Leading QA: @nikomakr
Labels:
MVP
Due Date:
22/01/2024
Dependencies:
None
Notes for Reviewers:
None
Description:
Creating a contact page with forms that will allow the user send in emails when need.
Priority:
High
Type:
MVP Feature
User story -
Currently has a form without state management, error and validation.
User Story - Expected Behaviour:
When the contact button on the nav-bar is clicked it takes you to the page which in turn allows you to contact the company either via a form or calls or emails. when the forms are filled the fields should be able to errorlog 'required' in cases where the field must be filled out and 'incorrect format' where wrong formates are used.
Steps to Reproduce:
not applicable
Screenshots:
none
Branch Name:
19-updated-contact-component
Additional Information:
none
Acceptance Criteria:
The form state must be efficiently managed, error logging, and validation done using Formik library.
All the sections of the required sections in the form according to the template present.
Subtasks:
not applicable.
Assignees:
Leading Developer: [@Chiamaka]
Leading QA: [@niko]
Labels:
MVP
Due Date:
23/01/2024
Dependencies:
None
Notes for Reviewers:
None.
Description:
We need to add contents to the footer of the page which must meet the below acceptance criteria.
Priority:
[High]
Type:
MVP Feature
User story - Current Behaviour:
Nothing showing on the footer
User Story - Expected Behaviour:
Should have a footer showing the address of the business, registration mailing address and copyright details.
Steps to Reproduce:
N/A
Screenshots:
N/A
Branch Name:
7-the-footer
Additional Information:
None
Acceptance Criteria:
Styling colors must be the stated webpage colors
Should have mailing information.
Address of the company.
Copyright details.
Subtasks:
None
Assignees:
Leading Developer: [@clamadi]
Leading QA: [@nikomakr]
Labels:
MVP
Due Date:
18/01/2024
Dependencies:
None
Notes for Reviewers:
None
1)Quick fix on Search & Hire page, so to render react-calendar
2)Upload fleet images
[High]
[MVP Feature]
All you can see as an end user as of now is "/search" by clicking on Search & Hire
End user by clicking on Search & Hire will be redirected to webpage where over there will show fleet options, data range and calendars
[FYI this is not the final. It is just the first optimisation of the page]
git pull from 2-searchhire-renderingfixes-andimages
and
npm run dev
Not required
2-searchhire-renderingfixes-andimages
Not finalised yet
Display fleet options
Start Date, End Date
Display Fleet options' calendars
Upload images
Search & Hire, react-calendar, JS, REACT
22/01/2014
Nothing for the moment, but need to get merged so won't keep team away from working with JSON and API
Nothing tricky here.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.