1. 首页
  2. 前端基础

Elements of Web Dev

1 引言

本周精读, 来一起总结 web 开发的环节, 知识块和技能点. 是不是像 xx 速成班宣传的一样, 培训三个月, 经验顶三年, 入职 BAT, 年薪三十万?

本文虽然是罗列知识点, 但我想很有意义. 对于学习的人来说, 提供一个路线图. 对从业者来说, 对全局有更好的把控, 利于看到自己的强项和不足. 对组建团队, 更能起到一个点将谱的作用.

在网上我没有搜到任何深入全面的总结, 提供的那几篇已经算稍微好一些的了. 其他的要么太过笼统(前端-后端-数据-运维, 完毕)要么太细太窄(并不是不好, 只是和本文性质不一样). Generalist 和 Specialist 之间永远是一对辩证矛盾, 持续思考.

本文提供了有层级的列表形式, 如果有兴趣的读者可以把它做成概念图形式, 相互关联与距离相关, 可能会有意料之外的效果.

2 列表

列表形式, 方便搜索浏览, 加上一些解释和列举

Backend

  • authentication, oauth

  • API design, RESTful, GraphQL

  • payment integration

  • social integration

  • session/cookie management

  • user management

  • Server, e.g. nginx, connection model, conf, rewrite

  • CRM

Deployment, Env management, Container

  • rollback/rollforward

  • no downtime, non-disruptive deployment

  • deploy to downstreams, e.g. npm, chrome extension store

  • artefact management, e.g. gzips, OS specific builds

  • container technology e.g. Docker, AWS ami

DB

  • schema design

  • ORM

  • language/env specific driver

  • test/seed data

  • backup

  • batching, DB perfgomance

  • query syntax, e.g. SQL, mongo query syntax

  • connection pool/concurrent connection management

  • connection restriction e.g. localhost only

MessagingQueue/Middleware

Testing

  • parallel execution

  • UI automated testing

  • browser/OS compatibility, e.g. headless browser, cloud solutions

  • screenshot diff regression

  • unit test, isolation

  • mocking

  • integration test techniques

  • coverage (line coverage, path coverage etc.), permutations

Security

  • CSRF, XSS, SQL injection, DDoS, brute force etc.

  • automated tools

OS

  • OS differences, e.g. filesystem, path separator

  • run daemon, startup job, process manager

  • ssh

  • everything bash, zsh, powershell, e.g. wildcard, expansion, syntax

  • everything *nix, du, filesystem, ps, process model, netstat, pipes

networking

  • HTTP, and everything it entails e.g. CORS, MIME types, chunked

  • websocket

  • webworker, service worker

  • proxy

Web visualization technologies and principles

  • webgl

  • 2D/3D coord system and calculations

Web standards, e.g. webassembly

performance tuning

  • frontend: lighthouse

  • backend: load balancing, perf monitoring and profiling

Source control

  • work flow

  • tagging, release, branching

  • PR, collaboration

  • commit message conventions

Project management, Product management

  • main success scenario

  • PRD doc, sketch

  • milestone, timeline, estimate

  • daily report, weekly report

Software Monitoring

  • performance monitor

  • exception monitor

  • alert and alarm rules

  • logging

Engineering

  • lint, prettier, custom rules, autofix

  • editor, IDE, plugins, e.g. intellisense

  • debugging, remote debug, debug mobile

Analytics

  • heatmap

  • conversion

  • bounce rate

Frontend

  • data flow

  • state management

  • componentization

  • transpile, packing tool, e.g. webpack gulp coffeescript Typescript

  • templating, e.g. handlebar

  • ajax, jsonp etc.

Design / styling

  • cascading rules

  • preprocessor, e.g. scss less

  • box model

  • z-index

  • flexbox

  • design principles, layout, color, theme

3 参考阅读

https://medium.com/coderbyte/a-guide-to-becoming-a-full-stack-developer-in-2017-5c3c08a1600c

https://medium.com/codingthesmartway-com-blog/the-2018-roadmap-to-fullstack-web-development-8884ff02557a

https://www.lynda.com/learning-paths/Web/become-a-full-stack-web-developer

4 更多讨论

讨论地址是:精读《Elements of Web Development》 · dt-fe/weekly

原文地址:https://github.com/dt-fe/weekly

看完两件小事

如果你觉得这篇文章对你挺有启发,我想请你帮我两个小忙:

  1. 关注我们的 GitHub 博客,让我们成为长期关系
  2. 把这篇文章分享给你的朋友 / 交流群,让更多的人看到,一起进步,一起成长!
  3. 关注公众号 「画漫画的程序员」,公众号后台回复「资源」 免费领取我精心整理的前端进阶资源教程

JS中文网是中国领先的新一代开发者社区和专业的技术媒体,一个帮助开发者成长的社区,目前已经覆盖和服务了超过 300 万开发者,你每天都可以在这里找到技术世界的头条内容。欢迎热爱技术的你一起加入交流与学习,JS中文网的使命是帮助开发者用代码改变世界

本文著作权归作者所有,如若转载,请注明出处

转载请注明:文章转载自「 Js中文网 · 前端进阶资源教程 」https://www.javascriptc.com

标题:Elements of Web Dev

链接:https://www.javascriptc.com/4961.html

« UniApp H5 浏览器下载图片 兼容iOS、Android
时代变了,现在居然可以这样写 CSS 了»
Flutter 中文教程资源

相关推荐

QR code