Super Full Stack Web Developer in Modern Expectation

Short guide for every curious developers

10 min readAug 18, 2016

The rapid growing phase of many tech startups currently affecting a lot of people to build an application that can be built as a business. Things like commerce, SaaS, social media, ride-sharing, B2B, communication, game, media, and so much more. Because of that, likewise the high rising of demand for people who can actualize that application technically: developer.

de·vel·op·er (n) a person who develops something technical.

Developer who can build application or website?

Correct. Thank you for your understanding. Yes, we’re not talking about the property developer.

Title or even career of developer that have an important role in appplication development is ranging wide, from software to hardware. But let’s just focus on the software here:

Web Developer
Frontend Developer
Backend Developer
Full-Stack Web Developer
Desktop App Developer
Mobile Developer (Android or iOS)
Software Engineer
Software Architect
DevOps (although this isn’t a job title)

For this guide, we focus only on Full-Stack Web Developer.

So, for founder or recruiter, if you need a developer, please be more specific. What kind of developer you need? Okay?

About a year ago, I was constructing a table or a spreadsheet about end-to-end guide to see what is takes to build a real web-enabled product. The initial purpose was built as a catalog for training and coaching, that summarizes various foundation or fundamental that needed to build modern web app as a software product. The original table was deprecated, and then moved to this Airtable base 🔗. In there, you can look the most substantial part, which are the “Technical” and “Operation”. My! Please be aware that requirements are for software product, not just a software project or ordinary website. But looking it now, it’s not even complete yet, my friends.

Because of that, we need to aware that the needs to become a true full-stack web developer in today’s world, are more and more complex. Related to that, let’s illustrate the landscape and expectation that currently already common.

There are several basic categories that special and obligated to be understood by a true full-stack web developer:

Technology and Business Landscape with Logic
Software Development, Design, Architecture, and Infrastructure
Web Development (including Frontend/Client, Backend/Server, API)
Data and Database (including SQL and NoSQL)
Platform, Library, and Framework (including *aaS)
Automation, Testing, and Integration (including QA/QC)
Deployment, Delivery, and Maintenance
System Administration, Network, and Configuration

So, it’s beyond just frontend and backend.

That much layer?

Not always, but I haven’t found the standard.

In other discussion, there are other opinions…

Being a Full Stack Developer — SitePoint 🔗

Client or Frontend (Browser or Mobile) including design
Server or Backend
Web Development Tools
Web Server and Database
Operating System including System Administration

What is a Full-Stack Developer? — Codeup 🔗

Server, network, and hosting environment
Relational and nonrelational databases
How to interact with APIs and the external world
User interface and user experience
Quality assurance and control
Security concerns throughout the program
Understanding customer and business needs

What is a Full Stack developer? — Laurence 🔗

Server, Network, and Hosting Environment
Data Modeling
Business Logic
API layer / Action Layer / MVC
User Interface
User Experience
Understanding what the customer and the business need

Let your imagination and ideas come free!

For full-stack web developer, all of those categories are required to know. Even more if you want to be a dev warriors in a startup. You need to know and understand all of those topics to bring your startup alive and run smoothly.

That’s it?

Yeah, so you can survive.

Okay, let’s spell out in more details, what are the things that essential to be known by a true modern full-stack web developer. At least, you have awareness, don’t have to master them all. Including all of the terminologies and names that good to know, based on popularity as well. We’ll skip every explanation for each points about what, why, how, and other nitty-gritty details. Beside, we have access to a search engine!

Based on popularity rating and in an unordered fashion, here they are, the most overwhelming tech stack we must aware of.

Prepare yourself.

Operating Systems and Platforms:

GNU/Linux (Debian, Ubuntu, CentOS, CoreOS, Arch, etc)
macOS
Windows 7, 8, 10
Android and Android Wear
iOS and watchOS
Fuchsia (yet to know)

Tools and Utilities:

Terminal, CLI, Shell, and scripting: bash, zsh, fish, any Linux terminal (Gnome, Terminator), iTerm, HyperTerm, PowerShell, SSH, PGP key, and almost all useful POSIX-compliant utilities.
Package manager: Homebrew, apt-get, rpm, nvm, npm, Bower, JSPM, pyenv, rbenv, rvm, apm, etc
Shell framework: prezto, oh-my-zsh, etc
Version Control System: Git, Subversion (SVN), GitHub, Bitbucket, GitLab, SourceTree, Tower, P4Merge, DiffMerge, etc
Versioning: Generic software release life cycle (alpha/beta), Semantic Versioning

Computer and Software Science, Logic, Process, Flow, Paradigm, Pattern, Architecture, API, Standard:

Number System: binary, octal, decimal, hexadecimal, etc
Common Data Structure and Types: char, string, number, integer, float, array, stack, queue, linked list, binary tree, matrix, graph, etc
Algorithm, Pseudocode, Complexity (Big O): sorting, searching, filtering, clustering, etc
Flowchart and Data Design: basic/common symbols and shapes, data flow diagram (DFD), Unified Modeling Language (UML), etc
Programming Paradigm: Imperative, Procedural, Object Oriented, Functional, Concurrent, etc
Design Pattern: creational, structural, and behavioural by Gang of Four, etc
Architectural Pattern: coupling and cohesion, plugin and extension, modules and packages, MV* (MVC, MVP, MVVM, etc), real-time, polling, Publish-Subscribe, Modular, Monolith, web service (WSDL, SOAP, REST, GraphQL/Apollo/Graph.cool, SOA, Microservices, etc), etc. Wow so many etcs!
Techniques: Refactoring, Modularization, Normalization, etc
Pattern Matching: Search Pattern, Regular Expression (regex), etc
Protocol: Internet Protocol (IP), HTTP, HTTPS (SSL/TLS), RPC, WebSocket, ws, Socket.IO+Engine.IO, Primus, SockJS, WebRTC, DDP, Faye, WAMP Protocol, Autobahn.ws, Crossbar.io, ShareDB, etc
Characteristic: sequential, serial, concurrent, parallel, synchronous/asynchronous, async/await, etc
Standard Organization, Foundation, and Documents: IETF and RFC, Linux Foundation, JS Foundation, Ecma International, W3C, etc
API: plain specification, API Blueprint, Apiary, Mashape+Kong+Gelato+Galileo, OpenAPI/Swagger, RAML, API Workbench, apiDoc, cURL, Postman, Insomnia, etc
Authentication, and Authorization: Session, JWT, OAuth 1 & 2, LocalStorage, Cookie, etc
Others: Operational Transformation (OT)

Concepts, Principles, Processes, and Techniques of Web/Application/Software Development, Design, Management:

Classic: Waterfall, Spiral, Prototyping, Incremental, Rapid, etc
Modern: Extreme Programming (XP), Six Sigma, Agile (Scrum and Kanban), Lean, Minimal, Design Sprint, Design Thinking, Pair Programming, etc
Testing: Unit Testing, Integration Testing, End-to-End Testing (E2E), Test-Driven Development (TDD), User Acceptance Testing (UAT), Behavior-Driven Development (BDD), Acceptance Test-Driven Development (ATDD), A/B Testing, etc
Process: Development-Staging-Production, Refactoring, Pragmatic, Don’t Repeat Yourself (DRY), GitFlow, etc
Organization: Flat, Holacracy, etc

Code Editors, Environments, Extensions:

Code: Vim, Emacs, Notepad++, Atom, Sublime, Visual Studio Code, Brackets, Coda, TextMate, Light Table, etc
IDE: Xcode, WebStorm, PhpStorm, RubyMine, PyCharm, IntelliJ, Eclipse, Netbeans, etc
Formatter: Prettier

User Designs, Interfaces, Experiences:

Layout: Adaptive and Responsive Web Design, Flex box, Grid, etc
Language and Brand: Internationalization (i18n) and Localization (l10n)
Web-related: CSS3, SVG, Canvas, WebGL
Others: Accessibility (a11y) and Usability (u7y)

Markup, Styling, Languages, Platforms, Libraries, Frameworks, Scaffolding, Extensions:

HTML: XML, DOM, Jade/Pug, EJS, Handlebars.js, Dust.js, mustache, ECT, Nunjucks, Haml, etc
CSS: Less, Stylus, Sass, Compass, PostCSS, Autoprefixer, etc
Components: Bootstrap, Foundation, Pure, Semantic UI, Tachyons, Glamor, BaseCSS, UIKit, Kendo UI, Ink Interface Kit, Formstone, Base, etc
Grid: Jeet, Bourbon Neat, LostGrid, Susy, Flexible Grid, Gridy, Flint, Gridset, CEDVEL, etc
Kit: Google Web Starter Kit, Boilerplate, Skeleton, etc
JavaScript, Node.js and Deno (including its flavors, styles, and techniques): ES6/ECMAScript 2015, Babel, async/await, stream/pipe, Promise, Generators, Thunk), JSON/JSON-LD/BSON/MSON, xhr/Ajax/AJAX, CoffeeScript, TypeScript, NativeScript, JerryScript, Dart, jQuery, Zepto.js, Express, Feathers, Koa, Hapi.js, Loopback, Hoodie, Geddy, Angular.js, Backbone.js, Marionette.js, Ember.js, Knockout.js, Polymer, React.js and React Native (+Refetch, Aphrodite, create-react-app), Vue.js (+Vuex), Riot, Cycle.js, Fluxible.io, choo.js, Meteor, donejs, MERN, MEAN, Derby, Sails, Aurelia, Durandal, Adonis, Deku, Webix, Apostrophe, KeystoneJS, Grav, Lodash/Underscore, Gulp, Grunt, Brunch, Broccoli.js, Mimosa, Webpack, Buck, Browserify, Rollup, SystemJS, Closure Compiler, Yeoman, Slush, Mega Boilerplate, Hackathon Starter, SuperAgent, State Management (Flux, Redux, Reflux, Relay, RxJS/ngrx/Falcor, Alt.js, MobX, Radium, NuclearJS, Cerebral, FlowType, ImmutableJS/Baobab), Ionic, Xamarin, PhoneGap, Cordova, Appcelerator Titanium, Fusetools, Sencha/ExtJS, ExponentJS, etc
PHP, Code Igniter, Laravel, Yii, Zend, CakePHP, Symfony, Wordpress, etc
Ruby, Rails, Sinatra, Lotus, Volt, RubyMotion, etc
Python, Django, Flask, Skulpt, etc
C, Makefile, etc
C++, Crow, Silicon, CppCMS, TreeFrog, etc
C#, .NET, SignalR, etc
Java, Play, Spark, Ninja, Weex, Android, etc
Scala
Clojure, ClojureScript, Luminus, Om.js, etc
Swift, Vapor, Kitura, Perfect, Swifton, etc
Go, Revel, Beego, Martini, etc
Perl, Mojolicious, Catalyst, etc
Lua, Luvit, etc
Elixir, Phoenix, etc
Elm
Opa
WebAssembly (wasm)
Others: Serverless, Apex
Static Site Generators: Jekyll, Middleman, Hexo, DocPad, Nanoc, Harp, assemble, Gatsby, Hugo, Pelican, Hyde, etc
for documentation purposes: Markdown, reStructuredText, Rich Text Format (RTF), apiDoc
for watching, testing, and coverage purposes: Browsersync, Watchman, TAP, Tape, Mocha, Chai, Sinon, Jasmine, Karma, Intern, Ava, Jest, Enzyme, Protactor, Gherkin/Cucumber, QUnit, JUnit, SuperTest, Selenium, Nightwatch, PhantomJS, CasperJS, Nightmare, Cypress.io, LABjs, Chimp.js, Wallaby.js, JSVerify, testdouble.js, gremlins.js, Appium, SauceLabs, Istanbul, Coveralls, etc
for configuration purposes: editorconfig, YAML, etc
for hinting/linting purposes: StandardJS, ESLint, JSCS, JSHint, coffeelint, etc
for character set/encoding purposes: Unicode, UTF, ASCII, jsontool, prettyjson
for learning purposes: NodeSchool Workshopper

Database, Search, Queue:

SQL: MySQL, MariaDB, PostgreSQL, Oracle, etc
Document: MongoDB, PouchDB, Couchbase, CouchDB, RethinkDB, Realm, etc
Key value: Redis, Riak, MemcacheDB, Aerospike, etc
Graph: Neo4J, Allegro, Objectivity
Column: Cassandra
Multiple: FoundationDB
Search: Elasticsearch, Solr, etc
Analysis and Visualizer: Elastic Stack (Elasticsearch, Logstash, Kibana)
Queue: ActiveMQ, RabbitMQ, ZeroMQ, Celery, Kue, bee-queue, bull, etc
Big Data: Hadoop, HBase, etc
API-designed: Horizon, Firebase, Lovefield, Breeze.js/Breeze#, Kinto, Deployd, Simperium, Parse, etc
ORM and ODM: Sequelize, Bookshelf, Mongoose, Mongorito, Thinky, etc
GUI Manager: MySQL Workbench, pgAdmin, Medis, Robomongo

Processes, Environments, Network, Server, Deployment, Infrastructure, and Orchestration:

Process: daemons, systemd/systemctl, launchctl, lunchy, Monit, etc
Server: Nginx (+OpenResty), Apache, etc
Process Manager: PM2, Phusion Passenger, etc
VPS: Digital Ocean, Linode, etc
PaaS: Heroku, OpenShift
IaaS: Amazon Web Services (AWS) and Amazon EC2, Cisco Metapod, Microsoft Azure Cloud Services, Google Compute Engine (GCE), Joyent
Cloud Storage: Amazon S3, Google Cloud Storage, Azure Storage
Cloud Messaging: Firebase Cloud Messaging, Mailgun, Lob, SendGrid, Postmark, Mandrill
Continuous Integration (CI): Jenkins, Travis, Drone.io, Strider, etc
Continuous Delivery (CD): GoCD, Snap CI, Codeship, CloudBees, etc
Containerization: Docker, Dokku, Panamax, rkt, Kubernetes, etc
Data Stream: PubNub
Job Processing: Iron.io
Virtualization: Vagrant, VirtualBox, VMWare
Virtual Private Network (VPN)
Sandbox Environment: Runnable, Sandstorm, CodeSandbox, Glitch

Assurance, Control, Analytics, Tracking, Monitoring, Reporting for Quality, Performance, and Data:

Generic: Google Analytics, GoSquared, Heap Analytics, Mixpanel, Piwik, Keen IO, Clicky, Mode Analytics, Kadira, etc
Tracking: TrackJS, Bugsnag
Logging: Sentry.io, Loggly
All in One: Segment.io, New Relic

Domain, Domain Name System (DNS), Security:

Registrar: Uniregistry, Name.com, NameCheap, Gandi.net, etc
DNS: CloudFlare, OpenDNS, DNSimple, etc
Encryption and Hashing: bcrypt, AES, SHA-256, MD5, etc

Account, Social, Messaging, Chat Platform:

Google+, Twitter, Facebook, App.net, etc
Slack, HipChat, Gitter, Discord, Franz, etc
Single Sign-On (SSO), Lightweight Directory Access Protocol (LDAP), etc

Sites, Productivity Tools, and Other Services:

Sites: Google, DuckDuckGo, Stack Overflow families, etc
Files: Google Drive, Docs, Sheets, Slides, Dropbox, etc
Management: Trello, Asana, Airtable, ZenHub, Waffle.io, etc
Documentation: man, Zeal, Dash, etc
Keyboard: Vimium, Alfred, Synapse, Launchy (RIP), etc
Workflow: IFTTT, Zapier, etc
Mailing: MailChimp, Constant Contact, etc
Imaging: ImageMagick, JPEGmini, nomacs, etc
Multimedia: FFmpeg, VLC, mpv, etc
Monitor: f.lux
Password: Bitwarden, Enpass, etc
Payment: Stripe, Interledger, etc
Web Traffic: SumoMe
Emoji: International/Apple, Google, Twitter, Facebook, Emoji One, etc

More and more things for the future!

Automation and Bot
Data Visualization
Internet of Things and Smart Home
Augmented Reality
Virtual Reality
Artificial Intelligence
Machine Learning
Blockchain and Distributed System
Cryptocurrency
Unmanned Aerial Vehicle (UAV) or Drone
Self-Driving Vehicle

That’s so much! Overwhelming! What a laundry list!

Yup maybe I’m exaggerating. haha. Well, to be clear, that’s the landscape, variant, and even ecosystem that are taking shape around modern full-stack web development (during 2000–2017). At least, some parts of those technologies are recognized by you, learn the pros and cons of them. Concerning the when and how to use it, sure enough it depends on the situation and condition of the project, product, or service that want to be built. Consult to the experts if you want it easier to digest.

So we need to be an Iron Man?

Yes and no. Jack of all trades, master of at least one.

Yeah, at least we have to choose one or more things to master. Indeed, it’s hard. Especially when you have to deal with a single technologist position in an early-stage team or startup. That’s cool, that’s why we have friends and communities. But if you already have a great team, then being Hulk or Thor is sufficient enough.

Need more? There is a list of recommended apps that I’ve been curating over the time in this Airtable base 🔗. Check it out. 🌟

There’s even this good visualization 🔗, in modest way:

Well, that’s the expectation. Along the time in modern times, clearly more and more things coming up. For more references, please check out various inspiring insights here:

If this story is useful, click ♡ Recommend so that others know. You can ▢ Bookmark this for future reading.
Visit my website: mhaidarhanif.com 🔗

Thank you for reading!

Super Full Stack Web Developer in Modern Expectation

Short guide for every curious developers

Written by M Haidar Hanif