OOUX, URL Structure, and Basic Functions in Redux

Samantha Zhang
One Side Project Challenge
3 min readJun 9, 2016


Slowly making progress in re-thinking and re-writing in React / Redux framework.

Photo by Sebastian Molinares via

This is the 5th project update on my journey developing and taking the One Side Project challenge. You can find my previous posts here.

Don’t be confused by the title, it’s still a slow month. I felt I was moving incredibly slow in React / Redux things. But with a little bit self discipline, I did make some progress this month.

Reorganizing the App Functions using Object-Oriented UX Framework

Not long ago, I went across OOUX: A Foundation for Interaction Design on A List Apart. It’s one of the cleanest ways to organize models and core functions of an app I know.

So I spent some time and reorganized the models in that framework:

Created on

As expected, it worked pretty well as a quick reference doc through out the development process.

URL Structure

Similarly, I put a little thought into the URL structure, too. Now that I’m adding a whole user admin page to the project, the URLs become a little bit more complex.

Previous URLs             Landing page Add a new page Edit blocks of a page Edit content of a page View a page

Notice that I wasn’t even using static URL in the previous structure.

New URLs                 Landing page About page
... Potentially more info pages Get all themes data Get one theme data
... Same thing for types, blocks, and pages Login Logout User admin welcome page Themes list Add a theme Edit / delete a theme
... Same thing for types and blocks Add a new page Edit blocks of a page Edit content of a page View a page

Basic Functions

Moving on, I implemented the basic functions (add, edit, delete, get) of theme, type, and block model. I also made the relationship amongst those models work:

It’s bare minimum functions for now. I haven’t made any changes to the CSS yet, but it’s working.

Next Steps

In June, the goal will be to re-create the drag and drop interface, add back the CSS, and hopefully finally launch to public. Finger crossed!

Give this article a 💚recommend if you enjoy it. Follow One Side Project Challenge for my future updates and other inspiring side projects.



Samantha Zhang
One Side Project Challenge

Christian. Help people understand data with design. Get an email when I write new articles: · My portfolio: