Echo.js

Episode 1: 前端开发吐槽大会

Listen Later

白羊：我觉得我们录完没说到一起去啊。
Astrian：怎么讲？我觉得还成？
白羊：我一直在说元素排版的问题，你一直在说分辨率的事儿。
Astrian：🙄🙄🙄

久等了！因为这期的剪辑出了一点小问题，因此让大家等待的时间有点长，非常抱歉。

Echo.js（真正的）第一期节目，两位点了不少前端技能点的主播，简单谈了谈有关前端开发（网页开发）的历史，吐槽有关 HTML 历史遗留问题带来的各种奇形怪状的问题，其中就包括多屏幕适配、长期以来的排版样式问题，以及目前前端开发技术栈被替代的可能性。

➤ 节目索引

  • 00:00:00 开场

  • 00:01:17 为什么要吐槽前端开发？

  • 00:04:00 响应式前端开发的由来

  • 00:10:17 HTML 的「流式布局」

  • 00:15:34 正常流程下做响应式网页的方法

  • 00:19:41 让人又爱又恨的栅格系统

  • 00:26:21 向 flex 开炮

  • 00:33:38 Flex 是一个比栅格系统更灵活的排版系统

  • 00:36:50 在网页做排版是一件「逆天而行」的事情

  • 00:38:13 另类适配方案

  • 00:55:43 马后槽：虽然会造成各种各样的问题，但意外很好用的…… 表格排版法

  • 00:56:43 尾声


    • ➤ STAFF

    主播：Astrian、白羊
    剪辑：白羊
    特别感谢：Christopher


    ➤ 补遗

    Christopher 在事后提醒我们，显像管显示器显示比例通常是 4:3 的重要原因是，更接近正方形的显像管显示器更容易以低成本方式生产。


    ➤ 相关链接

  • 知乎上有关显像管显示器比例的讨论：为什么早期屏幕是 4:3 比例？

  • 有关 WAP 的维基百科资料：无线应用协议

  • 节目中提到的几个前端视觉框架：Bootstrap、iView 和 Element

  • 拯救前端开发者们的 flex 样式特性的 官方文档

  • 通过绘制的草图生成 HTML 的工具：Sketch2Code。我们当时看的好像不是微软做的，不过原理似乎差不太多。

  • 在没有 Flex 的时候，设前后左右都是 50% 的居中方式：HTML+CSS，让 div 在屏幕中居中（水平居中 + 垂直居中）方法总结


    • ➤ 关于 Echo.js & 联系我们

    Echo.js 是一档关于编程与开发的播客节目。官网地址是 podcast.astrianzheng.com。我们推荐使用支持 RSS 方式订阅（即「泛用型」）的播客客户端收听。

    有话想说？可以来小宇宙 app 订阅 Echo.js 并给节目发评论，也可以发邮件至 podcast(a)astrianzheng.com。

    关注我们的：Telegram 频道、Twitter

    ➤ COPYRIGHT DISCLIMER

    开场音乐：Track: TOKYO MACHINE & Guy Arthur - GET UP [NCS Release]. Music provided by NoCopyrightSounds. Watch: https://youtu.be/HV7mLcsUp5U, Free Download / Stream: http://ncs.io/GetUp

    ...more
    View all episodesView all episodes
    Download on the App Store
    Echo.jsBy Astrian & 白羊
    • 4
    • 4
    • 4
    • 4
    • 4

    4

    1 ratings