Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Desktop & Mobile Apps With a Single Codebase

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

<p class="has-line-data" data-line-start="7" data-line-end="8">In this episode, Scott and Wes talk with Etienne Lemay, developer of <a href="https://missiveapp.com/">Missive</a>, about his experience building Missive, best practices, and the pros and cons of building desktop and mobile apps with a single codebase.</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "LogRocket__Sponsor_9" name="LogRocket__Sponsor_9"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at <a href= "https://logrocket.com/syntax">logrocket.com/syntax</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Freshbooks__Sponsor_12" name= "Freshbooks__Sponsor_12"></a>Freshbooks - Sponsor</h2> <p class="has-line-data" data-line-start="13" data-line-end="14"> Get a 30 day free trial of Freshbooks at <a href= "https://freshbooks.com/syntax">freshbooks.com/syntax</a> and put SYNTAX in the “How did you hear about us?” section.</p> <h2 class="code-line" data-line-start="15" data-line-end="16"> <a id="Show_Notes_15" name="Show_Notes_15"></a>Show Notes</h2> <p class="has-line-data" data-line-start="17" data-line-end="18"> 0:57 - What is Missive?</p> <p class="has-line-data" data-line-start="19" data-line-end="20"> 6:10 - What is the desktop app built in?</p> <p class="has-line-data" data-line-start="21" data-line-end="22"> 9:44 - Did you use any particular libraries for the front-end?</p> <p class="has-line-data" data-line-start="23" data-line-end="24"> 11:44 - How are you managing state?</p> <p class="has-line-data" data-line-start="25" data-line-end="26"> 13:37 - Is it challenging to do all of this in JS?</p> <p class="has-line-data" data-line-start="27" data-line-end="28"> 15:07 - What was the catalyst for the “multi-conversation swipe”?</p> <p class="has-line-data" data-line-start="29" data-line-end="30"> 21:32 - What is the mobile app built in?</p> <p class="has-line-data" data-line-start="31" data-line-end="32"> 24:00 - What are the advantages of Cordova?</p> <p class="has-line-data" data-line-start="33" data-line-end="34"> 30:30 - How do you manage offline/syncing/etc. so well in a JS app?</p> <p class="has-line-data" data-line-start="35" data-line-end="36"> 34:56 - How do you test it?</p> <p class="has-line-data" data-line-start="37" data-line-end="38"> 36:52 - Have you looked into Cypress?</p> <p class="has-line-data" data-line-start="39" data-line-end="40"> 39:35 - How do you style it?</p> <h2 class="code-line" data-line-start="41" data-line-end="42"> <a id="Links_41" name="Links_41"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="42" data-line-end="43"> <a href="https://twitter.com/etiennelem">@EtienneLem</a></li> <li class="has-line-data" data-line-start="43" data-line-end="44"> <a href="https://missiveapp.com/">Missive</a></li> <li class="has-line-data" data-line-start="44" data-line-end="45"> <a href="https://sparkmailapp.com/">Spark</a></li> <li class="has-line-data" data-line-start="45" data-line-end="46"> <a href="https://coffeescript.org/">CoffeeScript</a></li> <li class="has-line-data" data-line-start="46" data-line-end="47"> <a href="https://backbonejs.org/">Backbone</a></li> <li class="has-line-data" data-line-start="47" data-line-end="48"> <a href="https://redux.js.org/">Redux</a></li> <li class="has-line-data" data-line-start="48" data-line-end="49"> <a href="https://www.typescriptlang.org/">Typescript</a></li> <li class="has-line-data" data-line-start="49" data-line-end="50"> <a href="https://electronjs.org/">Electron</a></li> <li class="has-line-data" data-line-start="50" data-line-end="51"> <a href="https://webpack.js.org/">Webpack</a></li> <li class="has-line-data" data-line-start="51" data-line-end="52"> <a href="https://javascript30.com/">Javascript30</a></li> <li class="has-line-data" data-line-start="52" data-line-end="53"> <a href="https://cordova.apache.org/">Cordova</a></li> <li class="has-line-data" data-line-start="53" data-line-end="54"> <a href="https://facebook.github.io/react-native/">React Native</a></li> <li class="has-line-data" data-line-start="54" data-line-end="55"> <a href="https://fastlane.tools/">Fastlane</a></li> <li class="has-line-data" data-line-start="55" data-line-end="56"> <a href="https://aws.amazon.com/s3/">Amazon S3</a></li> <li class="has-line-data" data-line-start="56" data-line-end="57"> <a href="https://www.cypress.io/">Cypress</a></li> <li class="has-line-data" data-line-start="57" data-line-end="58"> <a href="https://sass-lang.com/">Sass</a></li> <li class="has-line-data" data-line-start="58" data-line-end="59"> <a href="https://tailwindcss.com/">TailwindCSS</a></li> <li class="has-line-data" data-line-start="59" data-line-end="60"> <a href="https://svelte.dev/">Svelte</a></li> <li class="has-line-data" data-line-start="60" data-line-end="62"> <a href= "https://syntax.fm/show/176/building-steam-games-with-react">Syntax 176: Building Steam Games with React</a></li> </ul> <h2 class="code-line" data-line-start="62" data-line-end="63"> <a id="_SIIIIICK__PIIIICKS__62" name= "_SIIIIICK__PIIIICKS__62"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="63" data-line-end="64"> Scott: <a href="https://www.disgracelandpod.com/">Disgraceland Podcast</a></li> <li class="has-line-data" data-line-start="64" data-line-end="65"> Wes: <a href="https://amzn.to/2l660M9">Wagner 590 Spray Gun</a></li> <li class="has-line-data" data-line-start="65" data-line-end="67"> Etienne: <a href="https://prettier.io/">Prettier</a></li> </ul> <h2 class="code-line" data-line-start="67" data-line-end="68"> <a id="Shameless_Plugs_67" name="Shameless_Plugs_67"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="68" data-line-end="69"> Scott: <a href="https://www.leveluptutorials.com/pro">Svelte Course Coming Soon!</a> - Sign up for the year and save 25%!</li> <li class="has-line-data" data-line-start="69" data-line-end="70"> Wes: <a href="https://wesbos.com/courses/">All Courses</a> - Use the coupon code ‘Syntax’ for $10 off!</li> <li class="has-line-data" data-line-start="70" data-line-end="72"> Etienne: <a href="https://missiveapp.com/">Missive</a></li> </ul> <h2 class="code-line" data-line-start="72" data-line-end="73"> <a id="Tweet_us_your_tasty_treats_72" name= "Tweet_us_your_tasty_treats_72"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="73" data-line-end="74"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="74" data-line-end="75"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="75" data-line-end="76"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="76" data-line-end="77"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="77" data-line-end="78"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="78" data-line-end="79"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="79" data-line-end="80"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this episode, Scott and Wes talk with Etienne Lemay, developer of Missive, about his experience building Missive, best practices, and the pros and cons of building desktop and mobile apps with a single codebase.
 LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
 Freshbooks - Sponsor Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section.
 Show Notes 0:57 - What is Missive?
 6:10 - What is the desktop app built in?
 9:44 - Did you use any particular libraries for the front-end?
 11:44 - How are you managing state?
 13:37 - Is it challenging to do all of this in JS?
 15:07 - What was the catalyst for the “multi-conversation swipe”?
 21:32 - What is the mobile app built in?
 24:00 - What are the advantages of Cordova?
 30:30 - How do you manage offline/syncing/etc. so well in a JS app?
 34:56 - How do you test it?
 36:52 - Have you looked into Cypress?
 39:35 - How do you style it?
 Links  @EtienneLem

 Missive

 Spark

 CoffeeScript

 Backbone

 Redux

 Typescript

 Electron

 Webpack

 Javascript30

 Cordova

 React Native

 Fastlane

 Amazon S3

 Cypress

 Sass

 TailwindCSS

 Svelte

 Syntax 176: Building Steam Games with React

  ××× SIIIIICK ××× PIIIICKS ×××  Scott: Disgraceland Podcast

 Wes: Wagner 590 Spray Gun

 Etienne: Prettier

  Shameless Plugs  Scott: Svelte Course Coming Soon! - Sign up for the year and save 25%!
 Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off!
 Etienne: Missive

  Tweet us your tasty treats!  Scott’s Instagram

 LevelUpTutorials Instagram

 Wes’ Instagram

 Wes’ Twitter

 Wes’ Facebook

 Scott’s Twitter

 Make sure to include @SyntaxFM in your tweets

Aplikace Youradio Talk

Desktop & Mobile Apps With a Single Codebase

Poslechněte si podcast