On The Road To Professional Web Development | Table Of Contents
--
*
Update
Thanks readers! You’ve been great.
While I don’t intend to update this blog series, I intend to refine my strategy and continue to contribute technical content. From a content-creator perspective, there are a few takeaways (from the data) worth noting:
The number of posts generated have been an excellent resume builder. With only the information in this series, I’ve attracted the attention of several prestigious tech firms (this was a key objective from my perspective as a content author). Where this blog artificially ends is where my story as a dev really begins. With that in mind, hopefully this gives you an idea of what tech firms (anecdotally, in my experience) are looking for from new recruits (like myself).
Each story had less than a hundred reads. Traffic was driven primarily by Medium, rarely through external search engines. Click-through from post to post was limited, and click-through via this Table of Contents was negligible. Compared to uncurated posts at an average approx 66% read-to-view ratio, curated posts generated 10x additional traffic with an approx. 33% read-to-view ratio. View counts maxed out when first posted, died down to only several daily views within a week, and maintained extremely long tails.
Since the total view count was low, click-through was low, and reads-to-views were high, I suspect that quality content attracted readers but the overall design of the series was lacking. This applies to the conventions I selected for the cover art and titles, as well as the way I presented links to navigate between each of my posts. I’ll redesign future content to be more friendly and accessible, but hopefully someone somewhere out there (maybe you :) find this information and this archived series insightful. Personally, I had a blast and learned a lot while writing it (and still learning!).
Thanks again for reading. If you’d like to see my latest work, check out my GitHub Pages site asa55(dot)github(dot)io! Hope to see you there.
*
Starting On The Shoulders Of Giants
Want to learn how to be a web developer? Me too. This post serves as the table of contents for a series documenting each topic studied as I follow this developer roadmap toward our goal. If you have a moment, open the roadmap in a separate tab and side-by-side it with this post. It’s an insightful flow-chart that goes hand-in-hand with this post. The roadmap was contributed by pros (kamranahmedse and others, not me) who continue to spend a great deal of effort illuminating an optimal path towards professional web development for the rest of us.
The latest and greatest version of the roadmap can be found here:
Another resource you won’t want to miss is the official website, roadmap.sh:
Can You Trust The Roadmap?
W3Schools trusts the roadmap enough to use it as training material on their website. I’ve learned a lot from them and trust the learning resources they endorse.
Can You Trust Me?
I am not a professional developer. My technical background includes 5 years’ experience as an engineer in industry with a MS in ECE and a thesis on machine learning. I claim no expertise but continually strive to become a better technical contributor. My underlying objective is to secure a remote-enabled career, which is why I will ensure this series remains laser-focused on the elements necessary to excel during a technical interview.
Table Of Contents
Table Of Contents | Intro
*All entries in this table will be linked to separate posts. The next post (JavaScript) is in active development. Check back soon for more!*
Required For Any Path
Table Of Contents | Front-end
Internet
- How The Internet Works
- What HTTP Is
- Browsers And How They Work
- DNS And How It Works
- What Domain Names Are
- What Hosting Is
HTML
- Learn The Basics
- Writing Semantic HTML
- Forms & Validations
- Conventions & Best Practices
- Accessibility
- SEO Basics
CSS
JavaScript
- Syntax & Basic Constructs
- Learn DOM Manipulation
- Learn Fetch API / AJAX (XHR)
- ES6+ & Modular JavaScript
- Hosting / Event Bubbling / Scope / Prototype / Shadow DOM / Strict
Version Control Systems
- Basic Usage Of GIT
- GitHub
- GitLab
- BitBucket
Web Security Knowledge
- HTTPS
- CORS
- Content Security Policy
- OWASP Security Risks
Package Managers
- NPM
- Yarn
CSS Architecture
- BEM
- OOCSS
- SMACSS
CSS Preprocessors
- SASS
- PostCSS
- LESS
Build Tools
Task Runners
- NPM Scripts
- Gulp
Linters & Formatters
- Prettier
- ESLint
- StandardJS
Module Bundlers
- Webpack
- Rollup
- Parcel
Pick A Framework
React.JS
- Redux
- MobX
Angular
- RxJS
- NgRx
Vue.JS
- VueX
Modern CSS
- Styled Component
- CSS Module
- Styled JSX
- Emotion
- Radium
- Glamorou
Web Components
- HTML Templates
- Custom Elements
- Shadow DOM
Testing Your Apps
- Jest
- react-testing-library
- Cypress
- Enzyme
- Mocha
- Chai
- Ava
- Jasmine
Type Checkers
- TypeScript
- Flow
Progressive Web Apps
Web APIs Used In PWAs
- Storage
- Web Sockets
- Service Workers
- Location
- Notifications
- Device Orientation
- Payments
- Credentials
Calculating, Measuring & Improving Performance
- PRPL Pattern
- RAIL Model
- Performance Metrics
- Using Lighthouse
- Using DevTools
Server Side Rendering (SSR)
React.JS
- Next.JS
- After.JS
Angular
- Universal
Vue.JS
- Nuxt.JS
GraphQL
- Apollo
- Relay Modern
Static Site Generators
- Next.JS
- GatsbyJS
- Nuxt.JS
- Vuepress
- Jekyll
- Hugo
- Gridsome
Mobile Applications
- React Native
- NativeScript
- Flutter
- Ionic
Desktop Applications
- Electron
- Carlo
- Proton Native
Web Assembly
- Learn The Basics
Table Of Contents | Backend
Internet
- How The Internet Works
- What HTTP Is
- Browsers And How They Work
- DNS And How It Works
- What Domain Names Are
- What Hosting Is
Basic Frontend Knowledge
OS & General Knowledge
- Terminal Usage
- How OSs Work
- Process Management
- Threads & Concurrency
- Basic Terminal Commands
- Memory Management
- Interprocess Communication
- I/O Management
- POSIX Basics
- Networking Basics
Learn A Language
- Java
- C#
- PHP
- JavaScript
- Python
- Ruby
Version Control Systems
- Basic Usage Of GIT
- GitHub
- GitLab
- BitBucket
Relational Databases
- PostgreSQL
- MySQL
- MariaDB
- MS SQL
- Oracle
More About Databases
- ORMs
- ACID
- Transactions
- N+1 Problem
- Database Normalization
- How Indexes Work
- Data Replication
- Sharding Strategies
- CAP Theorem
NoSQL Databases
- MongoDB
- RethinkDB
- CouchDB
- DynamoDB
Learn About APIs
- HATEOAS
- Open API Spec & Swagger
- Authentication
- REST
- JSON APIs
- SOAP
- gRPC
Caching
- CDN
- Server Side
- Client Side
Web Security Knowledge
Testing
- Integration Testing
- Unit Testing
- Functional Testing
CI / CD
- Learn The Basics
Design & Development Principles
- GOF Design Patterns
- Domain Driven Design
- Test Driven Development (TDD)
- SOLID
- KISS
- YAGNI
- DRY
Architectural Patterns
- Monolithic Apps
- Microservices
- SOA
- CQRS & Event Sourcing
- Serverless
Search Engines
- Elasticsearch
- Solr
Message Brokers
- RabbitMQ
- Kafka
Containerization vs. Virtualization
- Docker
- rkt
- LXC
GraphQL
- Apollo
- Relay Modern
Graph Databases
- Neo4j
WebSockets
- Learn The Basics
Web Servers
- Nginx
- Apache
- Caddy
- MS IIS
Building For Scale
- Mitigation Strategies
- The Difference Between Instrumentation, Monitoring & Telemetry
- Migration Strategies
- Horizontal vs. Vertical Scaling
- Building With Observability In Mind
Table Of Contents | DevOps
Learn A Programming Language
- Python
- Ruby
- Node.JS (JavaScript)
- Go
- Rust
- C
- C++
Understand OS Concepts
- Process Management
- Threads & Concurrency
- Sockets
- POSIX Basics
- Networking Basics
- Startup Management
- Service Management
- I/O Management
- Virtualization
- Memory / Storage
- File Systems
Learn About Managing Servers
Linux Operating Systems
- SUSE Linux
- Debian
- Fedora
- Ubuntu
- CentOS
- RHEL
Unix Operating Systems
- FreeBSD
- OpenBSD
- NetBSD
Windows Operating Systems
- Learn The Basics
Learn To Live In Terminal
- Terminal Multiplexers
- Text Manipulation Tools
- Process Monitoring
- Network
- Learn Bash Scripting
- Vim / Nano / PowerShell / Emacs
- Compiling Apps From Source
- System Performance
- Others
Networking, Security & Protocols
- Emails
- White / Grey Listing Emails
- SMTP
- IMAPS
- POP3S
- DMARC
- SPF
- Domain Keys
- HTTP
- HTTPS
- FTP
- SSL / TLS
- Secure Shell (SSH)
- Port Forwarding
Learn These Concepts And How To Set Them Up
- Reverse Proxy
- Forward Proxy
- Caching Server
- Load Balancer
- Firewall
Web Servers
- IIS
- Nginx
- Apache
- Tomcat
- Caddy
Learn Infrastructure As Code
Containers
- Docker
- LXC
Configuration Management
- Ansible
- Chef
- Salt
- Puppet
Container Orchestration
- Kubernetes
- Docker Swarm
- Mesos
- Nomad
Infrastructure Provisioning
- Terraform
- CloudFormation
- Pulumi
Service Mesh
- Istio
- Envoy
- Linkerd
- Consul
Learn A CI / CD Tool
- GitLab CI
- GitHub Actions
- Bamboo
- Azure DevOps
- Jenkins
- Travis CI
- TeamCity
- Circle CI
Learn How To Monitor Software & Infrastructure
Logs Management
- Elastic Stack
- Greylog
- Splunk
- Papertrail
Infrastructure Monitoring
- Prometheus
- Nagios
- Grafana
- Zabbix
- Monit
- Datadog
Application Monitoring
- Jaeger
- AppDynamics
- New Relic
- Instana
- OpenTracing
Cloud Providers
- AWS
- Google Cloud
- Azure
- Heroku
- Alibaba Cloud
- Digital Ocean
- Linode
- Vultr
Cloud Design Patterns
- Availability
- Data Management
- Design & Implementation
- Management & Monitoring
Closing Remarks
Special thanks to kamranahmeds et al. for creating and sharing their excellent web development roadmap. This post was published with permission.
