Growing Me

A Tech For Better project by FAC21.

Table of contents

• Team
• What is Growing Me?
• Features
• Tech Stack
• Database Schema
• Installation
• Key Learnings
• Additional Features
• Further information

Team

• Safia Ali ⭐
• Jo Humphrey ✨

What is Growing Me?

(Back to top)

An app and physical toolkit for a key adult to work with a care experienced children to explore their life story. The app is the digital companion to the physical toolkit, and was developed as part of the Tech For Better programme, and supported by the Paul Hamlyn Foundation.

Features

(Back to top)

What can you do?

• Log in with email or magic link ✨
• Set up a profile 🖼️
• Customize the Me Tree's background, location, companions and growing items 🍎
• Save a screenshot of the Me Tree to the gallery 📸
• Navigate through the Growing Me activities 🏋️

Tech Stack

(Back to top)

Dependencies

• react
• react-router-dom
• react-dom
• react-dnd
• react-dnd-html5-backend
• react-collapsible
• react-responsive-carousel
• react-burger-menu
• use-react-screenshot
• html2canvas
• @supabase/supabase-js
• styled-components

Database Schema

(Back to top)

Installation

(Back to top)

To use this project,

• clone this repo on your device using the command git clone
• cd into the growing-me folder
• Run npm install to install dependencies
• Create a .env file in the root folder. It should contain the following:

VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_ANON_KEY=your_anon_key

• To get your Supabase URL, create an account on https://supabase.io/, create a new project, then go to "Settings", "API" and then the URL field under "Config". The anon key is on the same page, under "Project API keys".
• Run npm run dev to run the app

Key Learnings

(Back to top)

• Independent debugging, tracing code paths and being OK with imperfection.
• A thorough understanding of state management pitfalls and coping strategies.
• React hooks - useReducer, useRef, useContext and many more! As well as custom hooks.
• Prioritisation and negotiation with a product owner.

Additional Features

(Back to top)

There were a few features we were unable to incorporate into the MVP due to time constraints. ⏳ These included:

• Add and delete multiple growing items to the Me Tree.
• Account setting features like change password, delete user account, and adding multiple children to one account.
• Use the Me Tree as an avatar throughout the app.
• "Lock" later content in the activities section until previous activities are complete.
• Move all illustration assets to Supabase.

Further Information

(Back to top)

www.growingme.co.uk

[email protected]

https://growing-me.netlify.app/