Upgrade to Pro — share decks privately, control downloads, hide ads and more …

From Native to Web – Renewing Sticker Shop

From Native to Web – Renewing Sticker Shop

LINE DEVDAY 2021

November 11, 2021
Tweet

More Decks by LINE DEVDAY 2021

Other Decks in Technology

Transcript

  1. Self Introduction Who am I? - John Edvard Reiten -

    32 years old viking from Norway - From a city with 3000 people - Joined LINE Fukuoka as a front- end developer in 2020 - Likes learning Japanese
  2. Agenda - What is Sticker Shop, how has it changed

    - Motivation, why did we migrate - What options do we have available when replacing native with web - Challenges with web compared to native - Closing statement
  3. Challenges with software keyboard - Scroll behavior is different on

    iOS when keyboard is open - Cannot open keyboard before user interaction Software keyboard
  4. - Sticky titlebar - Input in the middle - Fixed

    footer - Footer and titlebar act like static elements when the keyboard is open Software keyboard
  5. Web share API Screenshot taken from MDN - Can share

    content the same way as Native - Limited browser support
  6. Challenges with web Swipe to go back - No built

    in support to swipe back - Need to create it ourselves on web
  7. Challenges with web Read silent (manner) mode - Web pages

    don’t know if your device is muted
  8. Overcome these challenges Options - Research frameworks, tools, and libraries

    - Try to fix these problems in the beginning of development
  9. General migration challenges Integration with other apps - Other applications

    may be affected Many entry points to Sticker Shop - It’s difficult to know where all the users come from - It’s easy to miss existing functionality
  10. Keep backward compatibility - Only add new URLs, or add

    extra query parameters - Make sure redirect rules are in place if you absolutely need to change a URL Need to adjust URLs? Need to adjust APIs? - Only add new attributes - Don’t remove or change names, it can break existing applications
  11. Gradual release Benefits - Can monitor server load by releasing

    to only a few users - Time to fix errors and bugs not discovered during development - Can compare the “effectiveness” between the old and new version
  12. Making strategic choices - Who are your users? - Know

    your users to better understand what to create Know your users Know your market - What are you creating? - It’s not necessary to support what you don’t need