custom-paths.md

Custom Path Segments

Intended to help make decisions regarding what custom path segments should look like in our application, and the consequences they will have on our users.

Since we are giving our users the ability to name their room items as the please, and we are routing based on the title of bookmarks/cards, we need to come to some decisions regarding how these names are represented in the address bar. The reason is because if we do not retain vaild urls, it will cause severe issues with SEO performance. Here are the three entities which this currently pertains to:

1. Items/Interests (UserProducts)
2. Folders
3. Bookmarks

Example 1: Allowing Any Character

We do have the ability to let users name their room items by any name. This is very common problem for urls, and so there is already an established way to make any regular ASCII string URL-friendly. It's called URI encoding.

• Pros: Allows users to name their entities whatever the want.
• Cons: Looks kind of ugly.

Example: Naming a folder "Great ideas for mother's day brunch! :)" The resulting folder segment of the URL escaped would look like this: .../content/Great%20ideas%20for%20mother's%20day%20brunch!%20%3A)/bookmark...

Example 2: Only allowing certain Characters

We can decide to only let users name their entities certain characters (perhaps a-z, A-Z, 0-9, _, and -). Then we lose the ability for them to use spaces. If we do want to let users use spaces in their folder, item, or bookmark names/titles, then they need to be replaced with a URL-friendly character when we display the name in the address bar. Perhaps we replace spaces with the dash:

Item name: "myAwesome Photos" becomes myAwesome-Photos in the address bar.

Other Questions:

• Do we want to have a pre-defined schema for the custom segemts of the path. For example, for astetic purposes, do we want paths to look like:

// First letter of each word capitalized
"/room/john/content/Cool-Sneakers/Sweet-Nikes/Some-Bookmark"

(Or perhaps all lower-case, etc?)

• When "explore" or other pre-defined segments appears in the path, should they be capitalized?

As for letter case IMO that lowercase is a standard for web urls

And I think I have a solution for these ugly urls. We can create one-way transformation method that will replace all spaces in string with dashes. After that we can use it like this:

function replaceSpacesWithDashes(string) {
  // not a production version of algorithm
  string = string.replace(' ', '-', string);
}

bookmarkItemsFromStateStore.forEach(function(item){
  if (replaceSpacesWithDashes(item.title).toLowerCase() === this.props.params.cardTitle) {
    // bookmark found!
  }
});

Hope that you got my idea. And we can use this for room item names, folder names and card names.

I don't think Artem has any preference for what is in the address bar/url - just that when we display things in the APP they are well formatted.

I'm inclined to go with option 1 as it means less munging and interpreting of urls.