In @ymc9's recent article

Frontend, Backend, and the Blurring Line In-Between

ymc9 for ZenStack ・ Nov 17 '22

#fullstack #webdev #backend #frontend

• Why the front-end development is brighter?

• Why people out of front-end usually underestimate front-end work?

• What’s the benefit you could get of front-end development

Why the front-end development is brighter?

Acutally Yiming has completed explained the reason in this article, I will only specify one fundamental reason here if you haven’t checked out it yet.

That is the next big 'platform' has not emerged widely after the mobile internet has existed for many years. What can be done has been done, likely many times. There are more than enough players in every niche, and features offered by different brands are more or less on par. Eventually, those products with clever designs and intuitive user experiences win. Therefore the growth of the business is more like the user experience driven.

Take a look at some popular products in recent years:

• Notion
• Figma
• AirTable

You don’t see many dramatic new features compared to similar products. They just have a better overall user experience. Of course, great user experience needs to have a good UI/UX design first, but it also requires great front-end development to make it happen.

Otherwise, it easily ends up like this:

Why people out of front-end usually under estimate front-end work?

• Front-end work is just a tip of iceberg

  As a backend developer, one big argument I heard a lot, which I once believed, is that front-end development is just boring HTML+CSS work to make it looks 100% as design. The below image is usually used to illustrate:

  
  However, after being involved in the front-end development for a while myself, I think the image could also be used to describe the front-end work itself:

  
  So the HTML+CSS is only the 20% visible part. Let me use a ‘Like’ feature of Twitter to show you what’s under the water.

  

  As everyone can see, if you click the ‘like’, the button becomes clicked, and the likes count of 4,169 get updated to 4,170. Sounds easy? Have you ever considered below things:

  • What about the likes count text existing in other places? For example, the tweets list of Next.js’s Twitter account or the likes list of your own account. How do we keep the same data in sync on different parts of the screen?
  • The list of “likers” should have your name in it now. Do we need to retrieve that list from the server every time, or can we use a local cache? If we use a local cache, How and when do we make the local data consistent with the server and the other way around?
  • What if other guys click the ‘like’ of the post almost simultaneously as you?
  • What if the server has no response after you send the ‘like’ request for 2 seconds due to the network latency? What should we tell to the user?

  If you try to figure out how Twitter does for the above questions, you could easily go into a state where you don’t ‘like’ the post, but your name appears in the list of “likers” or the post appears in your likes list like below:

  

  Try to think about the trade-off Twitter has chosen😉

• People are not aware of how powerful the browser has become

  Another reason why people usually underestimate front-end work is that they don’t know how powerful the web browser has become now. Just think about how many products you can use on the browser without installing the application. Leave alone the recent products mentioned above, even the ancient classic applications like Microsoft Office and Abobe Phtoshop now have the browser version.

  Furthermore, with the new WebAssembly support, it’s hard to imagine what can’t be done in the browser. For example, you can use the full functionality of Google Earth like below:

  

  Or if you are a Node.js developer, you should check out what Eric Simons is building for StackBlitz, making the browser the only thing you need for your whole development process.

The benefit of front-end development

• Fewer dependencies

  I still remember that beautiful morning vividly, sitting on my couch trying to debug and fix some front-end issues like the below:

  

  'What a wonderful life of a developer!' It was the first time I ever had this feeling after I had been a developer for over 10 years.

  You usually just need Chrome and VSCode to get all your job done. With the help of StackBlitz, you might even do it with only chrome now!

• Unified Language

  The simpler our stack, The better our dev efficiency and quality. JavaScript/Typescript makes it possible to use one language for the code stack. With a modern framework like Next.js, you can even build the entire application in one framework.

• Quick Result

  You would always be the first to see your application's final result delivered to the end user.

• Build your own business

  What else can be better than building your own business all by yourself?

So would you like to be part of it?

ZenStack is a schema-first toolkit for building CRUD services in Next.js projects. Our goal is to let you save time writing boilerplate code and focus on building what matters - the user experience.