- Performance: Display progress when processing takes longer than the standard 3 second wait duration.
- Security: All calls to the backend must use a token
- Logging and Analytics: Log errors to data dog and analytics to google analytics
- Deployment: Automatic deployment using GitHub Actions
- Marketing and customer education: create a video for the feature and place the multi-language video as close to the customer as possible
- Long term vision: consideration
- Community outsourcing opportunity: explore opportunity
β€ When done it will be used by ADMIN/TRAVELLER/USER as follows
Outsourcing notes β
β About us:
We are small company building prototypes using Reactjs library, our prototypes consist of many React components whom must comply with the prerequisites below
π Pre-Requisites
-----------------
- Material UI must be used for all UI elements (No other library ex. Ant)
- Formik must be used for forms (including the formik Field, FieldArray)
- Use <Field as={TextField}) instead of <TextField /> when Formik is used (Please follow our sample from Github below)
- create-react-app with typescript template (do not eject the app)
- Use typography as much as possible
- pushed to a netlify
- Pushed a Github public repo see accepted project here https://github.com/alialiayman/happy-employee
- READ.md has project notes including netlify link and animated gif using screenToGif, in addition to screenshot showing successful build
β Project requirements
--------------------------
create-react-app with typescript if starting a new app, then in the App.tsx call the following functional component
<App>
<ComponentName param={mainParam}/>
</App>
As you can see, this component receives a prop, which is an object. This object in details is attached to this job. Please check the attachment and examine all the object members before starting.
Your must use Material-UI only. Please align UI elements in a <Grid> and use Typography as much as possible
A primary design for this component is also attached. Please check the attachment and review the design and make any corrections or suggestions before proceeding. If you have a better design than the attached or you believe a totally new design works best, Please let us know in a message. and include a drawing. This phase is very important on the final review and possibly an additional tip at the end of the contract.
To complete all the deliverers, the right developer will have experience in the following:
- React, typescript, Material UI, Formik, git, github, netlify
π Acceptance Criteria
------------------------
We will accept the work when:
1- We receive two links live demo and Github
2- READ.me file with contents (confirming all pre-requisites are met, or explanation when not )
3- We will validate that all pre-requisites are met
4- We will read the code and approve if we have no issues
5- If there is an issue, we will request modification
β£ Successful Projects
------------------------
If you want to see an example of an accepted project quickly, here are two GitHub urls. The first one if happy-employee and it shows Edit and view for an employee. The Edit form uses Formik exactly the same way we expect you to use Formik. The second url is for happy-user and it demonstrates how we expect you to use FieldArray if needed. Please check the READ.me for example how we expect the READ.me to look like
https://github.com/alialiayman/happy-employee
https://github.com/alialiayman/happy-user
β Conclusion
--------------
In your proposal, please share a brief summary of your experience and tell us about a recent web app you worked on.
You are welcome to share your github username as well.
As USER to HAJonSoft I want to find the name translated to arabic with indicator to indicate if the name has been reviewed or not.
Only translate the arabic name if the nationality.isArabic is true
Considerations β
trans.zip
Acceptance Criteria π
β€ When done it will be used by ADMIN/TRAVELLER/USER as follows
Outsourcing notes β
β New work discovered - stories to be created