Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Are Web Dev GUIs Going to Replace Us?

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 of Syntax, Scott and Wes talk about web dev GUIs — what are they, are they going to replace developers, are they good or bad, and more!</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "Hasura__Sponsor_9" name="Hasura__Sponsor_9"></a>Hasura - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> Hasura is an open source real-time GraphQL engine. It connects to your databases & microservices and instantly gives you a production-ready GraphQL API. Check it out at <a href= "https://hasura.io/">Hasura.io</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="LogRocket__Sponsor_12" name= "LogRocket__Sponsor_12"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="13" data-line-end="14"> 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="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"> 1:30 - What is “codeless”?</p> <ul> <li class="has-line-data" data-line-start="19" data-line-end="20"> The codeless movement is coming in with a force. Are they just selling something? Or is it a real concern?</li> <li class="has-line-data" data-line-start="20" data-line-end="27"> All types of jobs are being replaced by computers <ul> <li class="has-line-data" data-line-start="21" data-line-end="22"> Truckers</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> Cashiers</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> Lawnmowers</li> <li class="has-line-data" data-line-start="24" data-line-end="25"> Doctors</li> <li class="has-line-data" data-line-start="25" data-line-end="27"> Why not web developers?</li> </ul> </li> </ul> <p class="has-line-data" data-line-start="27" data-line-end="28"> 7:22 - First experience building sites with a GUI?</p> <ul> <li class="has-line-data" data-line-start="29" data-line-end="31"> <a href= "https://www.adobe.com/products/dreamweaver.html">Dreamweaver</a></li> </ul> <p class="has-line-data" data-line-start="31" data-line-end="32"> 10:18 - Entire website builders:</p> <ul> <li class="has-line-data" data-line-start="33" data-line-end="34"> <a href="https://www.wix.com/">Wix</a></li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <a href="https://www.squarespace.com/">Squarespace</a></li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <a href="https://webflow.com/">Webflow</a></li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href="https://www.modulz.app/">Modulz</a></li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="https://thegrid.io/">Grid.io</a></li> <li class="has-line-data" data-line-start="38" data-line-end="40"> Wordpress Builders</li> </ul> <p class="has-line-data" data-line-start="40" data-line-end="41"> 13:17 - When are GUIs useful?</p> <ul> <li class="has-line-data" data-line-start="42" data-line-end="43"> Brochure site</li> <li class="has-line-data" data-line-start="43" data-line-end="45"> Basic e-commerce</li> </ul> <p class="has-line-data" data-line-start="45" data-line-end="46"> 20:26 - Is a GUI/Codeless always better?</p> <ul> <li class="has-line-data" data-line-start="47" data-line-end="49"> It depends what you’re capable of doing</li> </ul> <p class="has-line-data" data-line-start="49" data-line-end="50"> 25:21 - Levels of hell GUI assistance in builders</p> <ul> <li class="has-line-data" data-line-start="51" data-line-end="52"> CMS - Just modifying content and basic markup</li> <li class="has-line-data" data-line-start="52" data-line-end="53"> Access to code, drag blocks into place</li> <li class="has-line-data" data-line-start="53" data-line-end="54"> No or minimal access to code</li> <li class="has-line-data" data-line-start="54" data-line-end="56"> No modification outside of options</li> </ul> <p class="has-line-data" data-line-start="56" data-line-end="57"> 31:36 - Are there GUIs for making applications?</p> <ul> <li class="has-line-data" data-line-start="58" data-line-end="59"> Native Mobile</li> <li class="has-line-data" data-line-start="59" data-line-end="61"> <a href="https://zapier.com/">Zapier</a></li> </ul> <p class="has-line-data" data-line-start="61" data-line-end="62"> 36:54 - Are jobs at risk?</p> <ul> <li class="has-line-data" data-line-start="63" data-line-end="68"> <p class="has-line-data" data-line-start="63" data-line-end="64"> Yes</p> <ul> <li class="has-line-data" data-line-start="64" data-line-end="65">I think a lot of WordPress tinkering has already been replaced</li> <li class="has-line-data" data-line-start="65" data-line-end="66"> The guy who knows what buttons to push is at risk?</li> <li class="has-line-data" data-line-start="66" data-line-end="68"> Webmaster jobs where the roll was just occasionally updating HTML and text</li> </ul> </li> <li class="has-line-data" data-line-start="68" data-line-end="73"> <p class="has-line-data" data-line-start="68" data-line-end="69"> No</p> <ul> <li class="has-line-data" data-line-start="69" data-line-end="70"> Government</li> <li class="has-line-data" data-line-start="70" data-line-end="71"> Educational institutions</li> <li class="has-line-data" data-line-start="71" data-line-end="73"> Major corporations that can’t have their content stored via a service</li> </ul> </li> </ul> <p class="has-line-data" data-line-start="73" data-line-end="74"> 39:55 - Our favorite GUIs to help development</p> <ul> <li class="has-line-data" data-line-start="75" data-line-end="81"> <p class="has-line-data" data-line-start="75" data-line-end="76"> Scott:</p> <ul> <li class="has-line-data" data-line-start="76" data-line-end="77"> <a href="https://www.netlify.com/">Netlify</a></li> <li class="has-line-data" data-line-start="77" data-line-end="78"> <a href="https://www.heroku.com/">Heroku</a></li> <li class="has-line-data" data-line-start="78" data-line-end="79"> <a href="https://studio3t.com/">Studio 3T</a></li> <li class="has-line-data" data-line-start="79" data-line-end="81"> <a href="https://code.visualstudio.com/">VS Code</a></li> </ul> </li> <li class="has-line-data" data-line-start="81" data-line-end="89"> <p class="has-line-data" data-line-start="81" data-line-end="82"> Wes:</p> <ul> <li class="has-line-data" data-line-start="82" data-line-end="83"> Sketch CSS Export</li> <li class="has-line-data" data-line-start="83" data-line-end="84"> <a href="https://www.digitalocean.com/">Digital Ocean</a></li> <li class="has-line-data" data-line-start="84" data-line-end="85"> <a href="https://cyberduck.io/">Cyberduck</a></li> <li class="has-line-data" data-line-start="85" data-line-end="86"> <a href="https://panic.com/transmit/">Transmit</a></li> <li class="has-line-data" data-line-start="86" data-line-end="87"> <a href="https://ohmyz.sh/">ZSH</a></li> <li class="has-line-data" data-line-start="87" data-line-end="89"> <a href="https://code.visualstudio.com/">VS Code</a></li> </ul> </li> </ul> <h2 class="code-line" data-line-start="89" data-line-end="90"> <a id="Links_89" name="Links_89"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="90" data-line-end="91"> <a href= "https://www.theverge.com/2019/8/30/20839810/irobot-terra-autonomous-lawnmower-roomba-robot-fcc-beta-release-date-2020"> Roomba’s first autonomous lawnmower</a></li> <li class="has-line-data" data-line-start="91" data-line-end="92"> <a href="https://notepad-plus-plus.org/">Notepad++</a></li> <li class="has-line-data" data-line-start="92" data-line-end="93"> <a href= "https://en.wikipedia.org/wiki/Yahoo!_GeoCities">Geocities</a></li> <li class="has-line-data" data-line-start="93" data-line-end="94"> <a href= "https://en.wikipedia.org/wiki/Angelfire">Angelfire</a></li> <li class="has-line-data" data-line-start="94" data-line-end="95"> <a href="https://www.sketch.com/">Sketch</a></li> <li class="has-line-data" data-line-start="95" data-line-end="96"> <a href="https://www.figma.com/">Figma</a></li> <li class="has-line-data" data-line-start="96" data-line-end="97"> <a href="https://www.gatsbyjs.org/">Gatsby</a></li> <li class="has-line-data" data-line-start="97" data-line-end="98"> <a href="https://products.office.com/en-us/excel">Excel</a></li> <li class="has-line-data" data-line-start="98" data-line-end="99"> <a href="https://www.meteor.com/">Meteor</a></li> <li class="has-line-data" data-line-start="99" data-line-end="100"> <a href="https://recurly.com/">Recurly</a></li> <li class="has-line-data" data-line-start="100" data-line-end= "101"><a href="https://gumroad.com/">Gumroad</a></li> <li class="has-line-data" data-line-start="101" data-line-end= "103"><a href="https://begin.com/">Begin.com</a></li> </ul> <h2 class="code-line" data-line-start="103" data-line-end="104"> <a id="_SIIIIICK__PIIIICKS__103" name= "_SIIIIICK__PIIIICKS__103"></a>××× SIIIIICK ××× PIIIICKS ×××</h2> <ul> <li class="has-line-data" data-line-start="104" data-line-end= "105">Scott: <a href= "https://podcasts.apple.com/us/podcast/the-baron-of-botox/id1493450409">Baron of Botox</a></li> <li class="has-line-data" data-line-start="105" data-line-end= "107">Wes: <a href= "https://www.amazon.com/Owlet-Baby-Monitor-Infants-Ultimate/dp/B06ZZXYD6S">Owlet Smart Sock</a></li> </ul> <h2 class="code-line" data-line-start="107" data-line-end="108"> <a id="Shameless_Plugs_107" name= "Shameless_Plugs_107"></a>Shameless Plugs</h2> <ul> <li class="has-line-data" data-line-start="108" data-line-end= "109">Scott: <a href= "https://www.leveluptutorials.com/pro">How To Build A GraphQL API</a> - Sign up for the year and save 25%!</li> <li class="has-line-data" data-line-start="109" data-line-end= "111">Wes: <a href="https://wesbos.com/courses/">All Courses</a> - Use the coupon code ‘Syntax’ for $10 off!</li> </ul> <h2 class="code-line" data-line-start="111" data-line-end="112"> <a id="Tweet_us_your_tasty_treats_111" name= "Tweet_us_your_tasty_treats_111"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="112" data-line-end= "113"><a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="113" data-line-end= "114"><a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="114" data-line-end= "115"><a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="115" data-line-end= "116"><a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="116" data-line-end= "117"><a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="117" data-line-end= "118"><a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="118" data-line-end= "119">Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this episode of Syntax, Scott and Wes talk about web dev GUIs — what are they, are they going to replace developers, are they good or bad, and more!
 Hasura - Sponsor Hasura is an open source real-time GraphQL engine. It connects to your databases & microservices and instantly gives you a production-ready GraphQL API. Check it out at Hasura.io.
 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.
 Show Notes 1:30 - What is “codeless”?
  The codeless movement is coming in with a force. Are they just selling something? Or is it a real concern?
 All types of jobs are being replaced by computers  Truckers
 Cashiers
 Lawnmowers
 Doctors
 Why not web developers?

  7:22 - First experience building sites with a GUI?
  Dreamweaver

  10:18 - Entire website builders:
  Wix

 Squarespace

 Webflow

 Modulz

 Grid.io

 Wordpress Builders
  13:17 - When are GUIs useful?
  Brochure site
 Basic e-commerce
  20:26 - Is a GUI/Codeless always better?
  It depends what you’re capable of doing
  25:21 - Levels of hell GUI assistance in builders
  CMS - Just modifying content and basic markup
 Access to code, drag blocks into place
 No or minimal access to code
 No modification outside of options
  31:36 - Are there GUIs for making applications?
  Native Mobile
 Zapier

  36:54 - Are jobs at risk?
  Yes
 I think a lot of WordPress tinkering has already been replaced
 The guy who knows what buttons to push is at risk?
 Webmaster jobs where the roll was just occasionally updating HTML and text

  No
  Government
 Educational institutions
 Major corporations that can’t have their content stored via a service

  39:55 - Our favorite GUIs to help development
  Scott:
  Netlify

 Heroku

 Studio 3T

 VS Code

  Wes:
  Sketch CSS Export
 Digital Ocean

 Cyberduck

 Transmit

 ZSH

 VS Code

  Links  Roomba’s first autonomous lawnmower

 Notepad++

 Geocities

 Angelfire

 Sketch

 Figma

 Gatsby

 Excel

 Meteor

 Recurly

 Gumroad
 Begin.com
  ××× SIIIIICK ××× PIIIICKS ××× Scott: Baron of Botox

 Wes: Owlet Smart Sock

  Shameless Plugs Scott: How To Build A GraphQL API - Sign up for the year and save 25%!
 Wes: All Courses - Use the coupon code ‘Syntax’ for $10 off!
  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

Are Web Dev GUIs Going to Replace Us?

Poslechněte si podcast