A Metaphorical Mansion of Memory Material.
_Memorization Station is a web application designed to spark interest in learning about the mind, memory, and how various systems that have been developed and used throughout history can be used to improve one's ability to absorb and recall information.
Its basic functionality at MVP will be to store charts/tables of "memory objects" and generally aid in the building of memorization systems. Users will have the ability to build and store charts of data listing mental associations with numbers, people, places, etc. as they build out different aspects of a personalized memory system, used to encode and recall various types of information.
- Goals:
-
To spark people's interest in learning about memory, and give users a basic understanding of memory systems and the ability to build some basic charts of associations.
-
Challenges:
- I believe I have a good understanding of how the different technologies are working together, but implementing all the necessary steps on my own on an invividual basis is definitely going to require me to cement my understanding of many of the details I haven't had much practice with yet.
-
Memorization Station in its MVP version should serve as a bit of an introduction to memory systems, and have the basic functionality of allowing a user to log in and create/store/edit basic "memory objects" to be held in charts/tables of various types, making up memory palaces, journeys, etc.
- Build a Ruby on Rails API to serve as a back-end server for application data.
- Seed server with personal data / charts.
- Build an elegant front end client in ReactJS using create-react-app.
- Allow for the storage of data and creation of useful new materials for use as references/associations when learning and building out systems for memorization of information.
- Increase ability to retain and recall information, helping to speed up learning overall.
- Add innovative, creative, and quirky new ways of building out these systems, gamifying the process in different areas and make process that can be tedious a lot more fun.
| Library | Description |
|---|---|
| React | Javascript library, used here via the Create-React-App package, used to build the application's front end. React's focus is on building speedy and responsive web applications by only updating the site's DOM when necessary, and having the various pieces of an application separated into components that are re-useable and lend themselves to efficient scaling and performance. |
| React Router | Used within the React to navigate between various screens/views and components making up the overall application. |
| Axios | Used to pull data into the for rendering on the page, Axios is responsible for efficient interaction between the front end and the RESTful API being served on the back end |
| Ruby on Rails | Used to build the back end of the application, where various API endpoints will be exposed to allow the front end to interact with the server and to manage the database. |
| Rails Router | Recognizes browser URLs on the application's back end and dispatches them to the controller actions requested. |
| Postgres | Architecture and management of the PSQL database._ |
Basic intended views for various screens:
- Desktop
- Tablet
- Mobile
- Wireflow / Siteframe
src
|__ assets/
|__ fonts
|__ icons
|__ images
|__ people
|__ places
|__ things
|__ symbols
|__ mockups
|__ components/
|__ Main.jsx
|__ Header.jsx
|__ Nav.jsx
|__ Footer.jsx
|__ Login.jsx
|__ CreateAccount.jsx
|__ CreateObjects.jsx
|__ DisplayCharts.jsx
|__ screens/
|__ Main.jsx
|__ About.jsx
|__ LoginSignup.jsx
|__ CreateObjects.jsx
|__ UpdateObjects.jsx
|__ ShowCharts.jsx
|__ services/
|__ utilities.js
|__ apiConfig.js
| Component | Type | state | props | Description |
|---|---|---|---|---|
| Main | functional | n | n | The main component will serve as the container for the body of the application. |
| Header | functional | n | n | The header will contain the navigation and logo. |
| Footer | class | n | n | The footer will hold some general information about the site (and perhaps the nav if layout were to change). |
| Navigation | functional | n | n | The nav component will contain links used to navigate to different views within the application. |
| Create Objects | functional | n | y | The user will enter data to create an object. |
| Show Charts | functional | y | y | The user will enter data to create an object. |
Use this section to estimate the time necessary to build out each of the components you've described above.
| Task | Priority | Estimated Time | Time Invested | Actual Time |
|---|---|---|---|---|
| Setup Rails Server Basics | H | 3 hrs | __ hrs | __ hrs |
| Setup User Authentication | H | 3 hrs | TBD | TBD |
| Models / Controllers | H | 2 hrs | TBD | TBD |
| Seed Data | M | 2 hrs | TBD | TBD |
| Testing & Troubleshooting | M | 4 hrs | TBD | TBD |
| Create React App, Cleanup junk, etc. | H | 2 hrs | TBD | TBD |
| API Config in Client | M | 3 hrs | TBD | TBD |
| Build out screens/views | M | 3 hrs | TBD | TBD |
| Basic layout & styling | M | 3 hrs | TBD | TBD |
| Figuring things out and learning by doing... | Priceless | Priceless | Priceless | Priceless |
| TOTAL | 25 hrs | TBD | TBD |
A model of the data structuring for the API on the back-end:
Post-MVP ideas for the project are plentiful.
Since both memory and the mind in general are topics I am extremely interested in, I see the MVP of "Memorization Station" as something to continue to build upon and use as a sandbox as I learn new technologies and technique, think of new tools to build, and try to imagine creative new ways to interact with or further build out the database. For example:
-
Searching for celebrities photos to use as images for the people associations.
-
Being able to build out more specific types of collections of memory objects, such as "memory palaces" containing items, "memory journeys" consisting of locations in a specific order, etc. Journeys could perhaps use a Map API to map out actual locations.
-
Perhaps allowing some interactions between multiple users/sharing of select charts or data, ability to export data sets to other software, etc.
-
Building various exercises & games, i.e. allowing the user to practice remembering the associations they build using flash cards, setting up a trivia game to used spaced repetition to help cement memorization, integrating playing cards, etc. Many possibilities.
-
As mentioned in the project prompt:
- Ideas for the future.
- Ideas for whenever..
- Ideas for probably never...
This section will include brief code snippets and notes highlighting functionality I found interesting or am proud of, along with a brief descriptions of the code:
Any major issues will be cataloged here along with resolution (for future referral, to act as a cautionary tale to others, and to accelerate learning by analyzing mistakes).