Implementing Deep Links in React with Atoms
Blog post from Sematic
Deep links are crucial for navigating directly to specific in-app locations on mobile platforms and within single-page applications (SPAs) on the web, as they enrich URLs with additional information to preserve and share a particular app state. This method allows users to return to a specific point within an app or share that view with others, making the user experience more seamless and interconnected. In the context of the Sematic platform, deep links are implemented using hash fragments in the URL, which are preferred over query strings or paths due to their ability to separate concerns with React Router, their ease of manipulation with libraries like Jotai, and because they are not sent to servers, allowing for more extensive data storage. Jotai, a state management library inspired by Recoil, facilitates the handling of URL hash segments, allowing for efficient state synchronization and manipulation. The article outlines the technical intricacies of using the `atom-with-hash()` function in Jotai to maintain and update deep links, ensuring that user interactions can be preserved and shared without creating unwanted intermediate states in browser history.