Light

redacademy / monkiri-spring-2019 Goto Github PK

View Code? Open in Web Editor NEW

0.0 4.0 1.0 31.4 MB

License: MIT License

JavaScript 91.57% Python 1.35% Java 1.26% Objective-C 2.74% TypeScript 3.08%

adp vancouver community-project

monkiri-spring-2019's Introduction

Description

This is the capstone project at RED Academy App Developer Program,where we applied what we have learned to create a fully functioning Financial Learning App for our client. This App allows users to log in and access Financial learning modules where users are able to interact with the lessons to increase their knowledge. This project consisted of us all working in an Agile team and collaborating through GitHub.

Preview:

Getting Started

- Clone this project.

- Run yarn install in the project directory

Setup

iOS:

react-native run-ios

Technologies Used:

React Native
Context
GraphCool
GraphQL
Apollo

Authors:

Frank Jun
Emre Kaynak
Saveen Toor
Naji Zhang
Full-Stack Developer student's at Red Academy

monkiri-spring-2019's People

Contributors

Watchers

Forkers

naijizhang

monkiri-spring-2019's Issues

Set up the image and fonts folder

Set up the image and fonts folder

Reusable Component

Create Reusable Component

Create lessons page view

Fix fonts

Fix the bug that causes Quicksand font type to be unrecognized.

Partners Page

Partners page displays cards that can open and close, displays color and icons. Cards will expand to show icons with links representing the companies

Create partner icon prop with link to a sponsor's website

Have the prop accept an image or a link to an external image.
The prop should render the image with a predictable height/width or a specified height/width

GraphCool

GraphCool backend

User authentiation

Save the difficulty/topics selections of the user to client state and update back-end

Lessons Screen

Create feature to add lessons from library

Create library page view

Remove Header

Remove header from from Onboarding and Authentication Stacks

Create progress info reusable component

Create calculator screen for compound interest

Create card prop that opens to show partners belonging to a lesson category

Have the prop accept a list of sponsors to render the list.
Make the card prop clickable and have it expand on click to reveal the sponsors. No animation required.

Create stage popup for lesson page

Create stage popup for lesson page, to show the stage information and start a lesson.

Profile Page

Profile Screen Styling

Improve profile screen styling by removing the edit button, making sure the banner sizes properly in all screen sizes, and adjusting the font sizes.

Create basic/advanced filter for library page

Create fonts for gobal style

Create a survey screen that requests the selection of multiple topics from a user, with a continue/skip interface

Sign-up and login screen

Front end for these screens

Add README

Add README file

add project description
add authors
add technologies used
add installation steps
add screenshots (GIFS)

Common components for sign-up and sign-in screens

creating shared components to use on both screens

Create lesson popup for topicList on lesson screen

Create lesson popup for topicList on lesson screen, and refactor the topicList component.

User Auth Flow

User auth flow:

Create a Backend To support your auth flow
- Use GraphCool
Login
- Create UI
- Connect UI to Backend Logic
Register
- Create UI
- Connect UI to Backend Logic
- User input validation

Change default user profile image in database

Use different link for default image url

Apollo Client

Apollo Client

Install package and dependency

Install package and dependency

Animate partners page view when tapping a card to expand it

Modify the partners view page so that it animates the expanding cards

Common components for survey screen and lesson screen

TopicList component and TopicItem component

Survey Screens

Create profile picture container scaffold

Mark up for sign in screen

Create and style sign in screen

Folder structure

Folder structure

Create profile share stats button

Navigator and Router

Navigator and Router

Create a survey screen that requests the difficulty beginner/advanced of a user, with a skip button

Create signin and signup screen

Create welcome screen with swiper functionality

Profile Screen Edit

Implement edit functionality for profile screen

Create library page search bar

Create theme object for styling

Create an object to store design specs for global styling

Create profile progress bar + show level up progress

Lessons Survey Onboarding

The user should only go through the lessons survey first time they log in to their account.

Create my lessons

Create GraphCool Server

Create stage two page

Create stage two page

Show the content
Have a True/False question
When user select an answer, show the result

Create a scrollable view container that show the partner cards

https://projects.invisionapp.com/share/9ZS1FYUGK8N#/screens/363583376
Cards included:
Mobile Wallet - Yellow
Savings - Green
Investment - Teal
International Money - Purple
Insurance - Orange
Taxes - Red
Debt- Pink
Budgeting - Dark Green
Business - Blue

Create profile picture + email + name display component

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.