From a8a7379242eb58b7ea073f5c6ac17d12c7fb454c Mon Sep 17 00:00:00 2001 From: i-yassin <30799708+i-yassin@users.noreply.github.com> Date: Wed, 10 Oct 2018 16:22:03 +0300 Subject: [PATCH] Update README.md --- README.md | 42 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/README.md b/README.md index c25b941..93cdee7 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,44 @@ # Task2 React + +Before moving forward with your second task, please see below: + +- I'm assuming you finished reading about ES 6, React and React components. So if you are not comfortable with your current state of knowledge, please refer to the main documentation of React (https://reactjs.org/tutorial/tutorial.html) + +- Please get yourself familiar with myjson APIs (http://myjson.com/api) before moving with this task. + +- Please work on each requirement of this task in an individual branch. If you are blocked by any part of the requirement please don't spend too much time on it, reach out to me ASAP and we can go from there. + +- Please make sure to write a clean and readable code. + +This task covers the following topics: React, JS/JQuery, Ajax/JSON, Grunt, Git, Node modules, IScroll library. + +For this task you are to build a simple task organizer for the company Tareas.io. This task organizer consists of different tasks. Each task have different attributes. You can add, edit, delete and reorder tasks. + + +Requirements: +1- Create an appropriate JSON for the task data. +2- Build the above structure UI. +3- Create the appropriate components for the above structure. +4- Install and setup the babel compiler using node modules. +5- Configure a grunt task to compile your code and watch for changes. +6- After finishing the above structure. Create a sub task for each task. +7- Create a scroller for the tasks view using IScroll library. + +Design considerations: +- Please make sure to create an appropriate design for the above sketch. +- Make sure to write all the styles using LESS format. +- Please use the same color scale for the tasks. +- The up/down arrows are used to change the task order (animation is extra) +- If a task have sub tasks please display them as an accordion for that task. +- Your task organizer should be responsive. +- Add delete and edit icons next to the arrows. + +Development considerations: +- You should be able to collect all the needed attributes for the task object before building your component. +- You should use JSX format for your code. +- Your component should follow the ES 6 syntax. +- Make sure to use the appropriate React component life cycle functions. +- You should use myjson APIs to create, update, and delete tasks. +- "Clear" button should clear the text area. +- Editing a task should enable an inline editor for the task.