I'm a frontend developer
Hi, my name is Tobias Lindstrรถm. I'm a developer with passion for frontend and an eye for design. This website is created to help others and educate myself to become a greater instructor.
My mono repository ๐
Created my own mono repository with Lerna and called it @gunnarx2. It contains hooks, utilities, linters etc.
01 December 2020ย ย โขย ย 1 min readuseTrapFocus(๐ฏ)
With this hook you will be able to trap the focus order and extend it with some grateful options.
26 October 2020ย ย โขย ย 1 min readAirbnb introduces visx ๐ฏ
Collection of reusable low-level visualization components. Combines the power of d3 to generate your visualization with the benefits of React.
05 October 2020ย ย โขย ย 1 min readCancellation with switchMap and custom promises โ
I will show you a simple snippet that uses axios to perform custom promises within switchMap.
29 September 2020ย ย โขย ย 1 min readuseScroll(๐)
New hook every day #7. Get scroll amount on y axis and the current direction, and with the opportunity to throttle the callback.
07 August 2020ย ย โขย ย 1 min readuseClickOutside(๐)
New hook every day #6. Trigger a callback when the user clicks outside of a defined element.
06 August 2020ย ย โขย ย 1 min readuseBreakpoint(๐)
New hook every day #5. With this hook we can communicate the use of breakpoints between SCSS and JavaScript.
05 August 2020ย ย โขย ย 1 min readuseWindowSize(๐บ)
New hook every day #4. Get window width and height with the opportunity to debounce the resize event.
04 August 2020ย ย โขย ย 1 min readuseResize(๐ )
New hook every day #3. A callback will be triggered when a resize event takes place. The hook can be debounced to be helpful to the browser.
03 August 2020ย ย โขย ย 1 min readuseEventListener(๐)
New hook every day #2. With this hook you can easily add event listeners and it will remove itself for you to avoid memory leaks.
02 August 2020ย ย โขย ย 1 min readuseMutationObserver(๐)
New hook every day #1. This hook uses MutationObserver to watch for changes being made to a defined target.
01 August 2020ย ย โขย ย 1 min readChrome Extension with Giphy API
Chrome extension created with React, Redux-Observable & Typescript. Uses Giphy's API to request GIFs.
27 March 2020ย ย โขย ย 1 min readResizeObserver hook ๐
The Resize Observer API provides a performant mechanism by which code can monitor an element for changes to its size.
30 October 2019ย ย โขย ย 2 min readEmbla Carousel ๐
Extensible low level carousels for the web. Extend it with basic JavaScript and build awesome physics simulated carousels.
07 September 2019ย ย โขย ย 1 min readReact with Cloud Firestore ๐ฅ
Cloud Firestore is a NoSQL document database that simplifies storing, syncing, and querying data for your mobile and web apps at global scale.
07 March 2019ย ย โขย ย 4 min readMeasure scrollbar width and height ๐
I thought it was difficult to measure the scrollbar, but after some research I changed my mind.
15 January 2019ย ย โขย ย 1 min readHow to create a breakpoint mixin with styled-components
CSS-in-JS is getting more common within modern frontend and styled-components is one of these libraries.
03 January 2019ย ย โขย ย 1 min readSimple integration with Unsplash API
Using Unsplash Source is the most easiest way of integrating their API in your application ๐ท
10 December 2018ย ย โขย ย 1 min readIterate over objects with ES7 ๐ฅ
Learn how to create a reusable function that iterates over objects with a ES7 method.
21 November 2018ย ย โขย ย 1 min readDisable :hover on touch devices ๐ต
Hover effects are unnecessary when the user is on a touch device because it's not possible to perform a hover.
05 November 2018ย ย โขย ย 2 min read