View the deployed application here
CURA is your personal data management application. Every day we traverse the web on multiple devices - reading articles, watching videos, setting tasks, and sharing our thoughts. Each of these actions often requires its own application. Where did I watch that video last week? Who published that article I read last month? Which app did I write my grocery list in? Where did I write that note? CURA aims to organize these events in one seamless timeline so that nothing is ever on the tip of your tongue, but just a click away. Write notes, save articles, create task lists, and catalogue all your digital media with CURA.
The CURA MVP will include a functioning server with SQL tables for Users, User Posts, and User Links. The CURA MVP will also deliver a functioning front end via React.js that includes minimal styling as well as the base functionality that allows users to sign up, sign in, view their personal timelines, as well as add either a note or a link to their timeline. Each user will have two timelines, one that spans their time as a user, and one for each day.
- Create a dynamic and interactive application that is as engaging and delighful as it is useful.
- Utilize Bcrypt and JWT to create a userbase for the application.
- Integrate dynamic functions that render data efficiently.
- Utilize link metadata to render photos and article titles when a user renders a new link element to their personal timeline.
- Incorporate elements that allow a user to customize their experience on the platform.
- Utilize dynamic styling to create an interactive and dynamic user experience.
| Library | Description |
|---|---|
| React | User facing framework. |
| React Router | Link/Route components. |
| Axios | Handle and execute database queries. |
| Ruby on Rails | Development of backend/server functionality. |
| Bcrypt, JWT | Handling user authentication. |
| LinkPreview API | Rendering Link metadata to User Timeline. |
- Desktop Landing
- Login PopOver
- UserTimeline
- Mobile Landing
- Mobile Login
- Mobile TimeLine
- Mobile TimeLine Components
- Tablet Landing
- Tablet Login
- Tablet TimeLine
- Tablet Timeline Components
src
|__ assets/
|__ fonts
|__ graphics
|__ images
|__ wireframes
|__ components/
|__ Header.jsx
|__ Header.css
|__ Login.jsx
|__ Login.css
|__ Landing.jsx
|__ Landing.css
|__ SignUpPage.jsx
|__ SignUpPage.css
|__ SingInPopUp.jsx
|__ SingInPopUp.css
|__ UserSettings.jsx
|__ UserSettings.css
|__ DailyTimeline.jsx
|__ DailyTimeline.css
|__ UserTimeline.jsx
|__ UserTimeline.css
|__ TimelineTextPostInput.jsx
|__ TimelineTextPostInput.css
|__ TimelineLinkInput.jsx
|__ TimelineLinkInput.css
|__ TimelineTextPost.jsx
|__ TimelineTextPost.css
|__ TimelineLinkPost.jsx
|__ TimelineLinkPost.css
|__ services/
|__ apiconfig.jsx
|__ apihelper.jsx
|__ auth.jsx
|__ App.js
| Component | Type | state | props | Description |
|---|---|---|---|---|
| Header | class | n | n | The header will contain the user sign in and logo. |
| Login | class | y | n | The Login component will grant user access. |
| Landing | class | y | n | Landing page will provide app preview for new users. |
| SignUp | class | y | n | Will allow new users to create an account. |
| SignIn | class | y | n | Will welcome returning users to the platform. |
| UserSettings | class | y | n | Allows existing users to change details and customize view settings. |
| DailyTimeline | class | y | n | Landing page after login, allows user to add text post and link post. |
| UserTimeline | class | y | n | Compiles all DailyTimelines from user History. |
| LinkInput | functional | n | y | Interactive input component that allows users to add links to their timeline. |
| TextInput | functional | n | n | Allows users to add text notes and journal entries to their timeline. |
| TextPost | class | n | y | Renders data from TextInput component to DailyTimeline Component. |
| LinkPost | class | n | n | Renders Metadata from LinkInput to DailyTimeline Component. |
| Task | Priority | Estimated Time | Time Invested | Actual Time |
|---|---|---|---|---|
| Develop server database | H | 5 hrs | ||
| Create CRUD Actions | H | 5 hrs | ||
| 12 Front End Components | H | 15 hrs | ||
| Front End CRUD functions | H | 5 hrs | ||
| Base Styling | H | 5 hrs | ||
| Dynamic Styling | M | 8 hrs | ||
| TOTAL | 43 hrs |
- Convert React.js files to either React Native or Cordova for later deployment to the App store.
- Continute building out database to add Timeline functionality including: i. User uploaded photos, videos, and scanned documents ii. Daily task lists iii. Reminders, birthdays and deadlines (with incorporated notification functionality) iv. User Wishlists for adding products from various stores around the web v. Integrate GeoLocation and check in services like FourSquare vi. Calendar functionality that integrates with Daily Timeline seamelessly. vii. Bookmark functionality which saves important events, articles, and other media to a users profile.
- Create functionality for users to connect with one another via comments, likes, and messages - with a focus on collaboration as a business class application.
- Functionality that recommends related content to users based on Links they've added to their Timeline, or what other users are sharing.
- Allow users to collaborate on task lists, timeline text posts, send engaging messages, and comment and interact with user posts.
- Integrate functionality that allows users to add private and public events to their timelines
- Develop a browser extension that allows users to seamlessly integrate browser history into their timelines, and decide which visited links they would like to add to their personal timeline.