Mastering Full Stack Engineering in 15 to 24 weeks for beginners and experienced alike (Restructuring in progress).

A close peek at our open-source curriculum!

Anyone can code, provided you read enough, code enough, ask for some support when needed, participate in the community, appreciate community contribution and voila, one day you will be a coder!!

The time period may vary depending on your background and earlier experience with computer science.

By the way, the story of my startup is being documented here in raw form for those interested.

https://medium.com/@rajeshpillai/story-of-a-startup-the-motivation-part-1-ef2b0938322d

If you are an absolute novice, the minimum time period will be 20 weeks.

If nothing works books will definitely not fail you!!!

Some of the readers here know that we have started publishing regular videos on front-end and related technologies on our YouTube channel https://www.youtube.com/user/tekacademylabs.

The initial videos are just kind of a teaser to get used to the recording process. The bigger goal is to build a large set of quality content that can be open-sourced and made freely available to the community and our employees and interns.

We work in the areas of front-end engineering, data science and analytics using both proprietaries as well as open-source suite of products.

To make sense of all this let me give you a brief background of what we as a company does. We started in 2012 under the banner “TekAcademy Labs” with two people, me and my partner and wife, Radhika Pillai, and later in 2017 we moved to a new entity “Algorisys Technologies”.

TekAcademy Labs will still be the channel where we will publish all our content at this point in time for free.

My journey with computers and programming started way back in 1993, but until 1995 mostly programs were written in my notebook with a pen an paper for lack of access to a computer system.

My initial learning was all from books as internet content was not so prominent at that time. Almost the same is the story of my partner as well, but that’s for another blog post.

Prior to starting the company we both had about 18+years of experience in development as well as consulting and my experience was primarily in the development, both desktop and web and building enterprise systems including working as a consultant with some of the largest eCommerce portals, in India, US, and UK and local Banking Systems in India.

I as an individual, have built/ architected Core Banking Solutions both desktop and web-based which is used by 100’s of cooperative banks in India.

What we do and have done for the past 6 years is we recruit interns/freshers and train them for a period of 3 to 6 months depending on their skill set and make them ready to work on our products or with our clients.

These 6 years has taught us a huge lesson on what works and what doesn’t works and also how a specific set of learning materials have an impact on the overall skills of our people.

The people who came to us had a variety of background, including accounting, commerce, biotechnology and a few from CS.

As we got feedback from the clients and our constant interaction and mentoring people, we kept on improving our internal curriculum/pattern based on what was required.

But things were not structured and mostly ad-hoc based on needs. This is where this curriculum is being drafted to overcome the problems that we faced.

The thing that was lacking was a well-defined structure, which I am now laying down here for your kind perusal.

And I think at this point we have reached a stage where we can put together all these learnings and lessons learned from mistakes into an approachable form of structured content which can be used by anyone interested in learning to code.

Currently, we are now a team of about 50 people and the majority of them were part of the initial training/internship that we conducted and we hired them.

Based on the leanings of these 6 years, the following curriculum has been planned for all our interns whom we are planning to hire or whoever wishes be part of this exciting journey.

This specific post is related to the web development curriculum. We will also be publishing a similar path for Data Science and Analytics.

As a company and as an individual we had learned a lot from the community as a whole, so we thought of making the content and videos free and opensource and made available to anyone who needs them. That is where the YouTube channel comes into play.

Initially, courses will be published on udemy as well for financial support but all textual contents and YouTube will be opened for all.

Even udemy courses will carry huge discounts and free coupons will be periodically made available.

Also, when I say opensource, I mean, as part of the curriculum we will be building some real products which we may use internally or make it available to the general audience and as such will be available to the community to learn, to share, to discuss and to collaborate.

The entire idea behind the content is to mostly learn from First Principles and hence we will be recreating many libraries, frameworks, servers from scratch to understand the process intuitively.

We may need community assistance in certain areas where we feel we won't’ be able to do justice, but the community can come in and play a pivotal role.

The following is the most comprehensive study plan that we are planning for our interns as well as self-learners including freecodecampers and the contents will be incrementally published.

Section 0 — HTML and CSS

• The DOM
• Basic markup
• Page Layout
• CSS
• Responsive Layout
• FlexBox and Grid
• CSS Frameworks
• Essential Graphics and Web Design for developers.

Projects

• Build a static portfolio page.

Learning the Ecosystem

• Introduction to Cloud Computing
• Docker
• Kubernetes
• DevOps

Section 1 — Ground Zero

• Overview and frontend engineering landscape
• Source Control and Git
• Communication and task management

1.1 — Foundations of Programming

• Pseodocode
• Algorithms
• Flowcharts
• Concepts of Variables, types, loops, functions.
• Naming conventions
• Logical thinking
• Problem-solving

1.2 —Fundamental JavaScript

• Introduction and motivation
• Writing your first program
• Variables
• Types
• Conditionals
• Conditionals
• Looping
• Nested loops
• Functions
• Hoisting
• Recursive functions
• Objects
• Object vs Functions
• Constructor function
• Context and Scope
• Understanding “this"
• Closures
• DOM
• Events
• Concepts of virtual DOM
• Shadow DOM
• Asynchronous code
• Promise
• Forms and best practices
• Browser history
• Frames
• Ajax and related concepts
• HTML5

Projects

• Build a 2D Game using HTML5 canvas
• Build the same game using DOM

1.3 — Testing

• Unit Testing
• TDD
• Integration Testing

1.4 — Advanced JavaScript

• DOM in depth
• Module Pattern
• Proxy Pattern
• Revealing Module Pattern
• Mixins
• Closures in Depth
• Lexical Scoping
• ES6+

1.5 —Design Patterns

• Creational
• Structural
• Behavioral
• MVC/MVP/MVVM

Projects

• Build a DOM Library
• Build a frontend framework using ES6 and Patterns

1.6 — JavaScript Tooling

• Custom build process
• Webpack
• Gulp/others+

1.7 — Functional Programming

1.8 — Accessibility

1.9 — Building a common web interface using JavaScript

** Forms

• Input Feedback
• Modal Dialogs and Popups
• Calendar
• Drag and Drop
  1. JavaScript basic drag and drop tutorial (18 Minutes) https://www.youtube.com/watch?v=RZjKNbAC87Q
• Expandable Input
• In-place Editor
• Captcha
• Password Strength Meter
• Autosave

** Navigation

• Tabs
• Accordions/Collapsible
• Vertical Dropdown Menu
• Accordion Menu
• Horizontal Dropdown Menu

** Hierarchy

• Modal
• Popup
• Breadcrumbs
• Notifications

** Content

• Tagging
• Carousel
• Tag Cloud
• Favorites
• Cards
• Pagination
• Continuous Scrolling
• Thumbnail

** Tables

• Table Filter
• Drag and Reorder Columns
• Sort by Column
• Search

** Images

• Preloading
• Lazy Loading
• Gallery
• Slide Show
• Image Zoom
• Filters (using HTML5 Canvas)

** Search

• Autocomplete

Projects (WIP)

• Build a web page for a startup/community
• Code a client-side part of a product.

Section 2 —Core Computer Science Skills

2.1 — Math for Programmers (WIP)

• Number System
• Modular Arithmetic
• Sequences and Series
• Proofs
• Induction
• Number Theory
• Graph Theory and Coloring
• Matching Problems
• Relations, Partial Order, Scheduling
• Sums
• Divide and Conquer Recurrence
• Linear recurrences
• Counting Rules
• Probability
• Statistics

2.2 — Data Structures and Algorithms

DSA 1

• Array
• Basic Recursion
• Hashing
• String
• Searching (Linear Search, Binary Search)
• Sorting ( QuickSort and its variation, Mergesort, Counting sort, Insertion Sort, Heap Sort, Comparator)
• Linked List ( Singly Linked List, Doubly Linked Lists, Circular Linked List, Skip List, Doubly Circular)
• Stack
• Queue

DSA 2

• Queues ( Queue Operations, Implementation, Different Questions, Deque Operations, Implementation)
• Binary Tree
• Binary Search Tree (CRUD, AVL)
• Heaps (Binary Heap)
• Graphs (Types of Graphs, BFS, DFS, Cycle Detection, Connected Components, Bipartite Graph)

DSA 3

• Dynamic Programming
• Graph Algorithms (Shortest Path Algorithms, Connected Components, Bridges)
• Trie, Segment Tree, Disjoint Set

2.3 — Computer Networks (For Core Software Engineering)

• Introduction to Computer Networks
• Transmission Modes
• Network Topologies
• TCP/IP vs OSI Model
• Circuit Switching vs Packet Switching
• Flow Control Protocols
• Error Detection
• IP and Classful Addressing
• Classless Addressing
• IPv4 vs IPv6
• Routing Protocols
• ARP & Reverse ARP
• Transport Layer
• TCP & UDP
• Application Layer

2.4 — System Design (For Core Software Engineering)

• ECommerce Design
• Parking Lot Design
• Tiny URL Design
• Bookmyshow Design
• Uber Design
• Facebook/Yelp

2.5 — Operating System

• Operating System and its Types
• Multiprogramming, Multiprocessing, Multithreading
• Process Management
• Process Scheduling
• Inter-process communication.
• Multi-threaded programming.
• Process Synchronization.
• Deadlock
• Deadlock Recovery
• Memory Management
• Virtual Memory

2.6 Database Management System

• Introduction to DBMS
• Architectures
• ER Model
• Relational Model
• Keys in Relational Model
• Database Normalization
• Normal Forms
• Concurrency Control
• Indexing in Database
• B+ Tree Introduction
• SQL

Section 3— Server side programming

3.1 Server-side with NodeJS

• Concepts and foundations of NodeJS
• Understanding core packages
• Understanding Routing
• Understanding SSR
• Understanding session and state management
• Authentication and Authorization
• Single sign-on
• Security
• Socket.IO for real-time communication
• Deployment

3.2 — Building a custom backend framework like ExpressJS

• HTTP
• Routing
• Modules
• Middlewares
• View Engine

3.3 — Build your own web server

• Introduction
• Networking
• A simple HTTP Server

Section 4— Databases

• Fundamentals of Relational and NoSQL
• *Building your own mini database engine using the Data Structures and Algorithms that we study.
• MongoDB
• MySQL/PostgreSQL

Section 5— API’s and Microservices

Any 1 Mandatory, 2 or all from ReactJS, Angular, VueJS (It’s up to your hunger)

Section 6— ReactJS

• Introduction to the philosophy
• The Virtual DOM
• Build your own Virtual Dom
• Understanding JSX
• Conditionals and Loops
• Components
• Functional and Stateful Component
• Parent/Child communication
• Understanding state and props
• Asynchronous nature of setState()
• Life Cycle
• Children types
• The Context API
• Destructuring arguments
• Spread attributes
• Style Components
• Controlled Input
• Presentation and Container Component
• Higher-Order Components
• The Render Props
• State Management
• Building reusable components
• Authentication and Authorization
• Animations and Transitions
• Server-Side Rendering
• Application Architecture
• Server-Side Rendering
• Performance Best Practices (Learning from the field)

Section 7— Angular

• Philosophy
• TypeScript Fundamentals
• Angular Fundamentals
• Components
• Communication Between Components
• Templates
• CLI
• Directives
• Services
• Dependency Injection
• Data binding and Event Handling
• Pipes
• Building Reusable Components
• Template Driven Forms
• Reactive Forms
• HTTP Services
• Routing and Navigation
• State Management
• Authentication and Authorization
• Animations and Transitions
• Server-Side Rendering
• Deployment
• Testing

Section 8— VueJS

• Philosophy
• DOM Interaction
• Conditional and Rendering
• Vue Instances and Life Cycle
• Components
• Class and Style Bindings
• Communication Between Components
• Forms
• Directives
• Filters & Mixins
• Animations and Transitions
• HTTP
• Routing
• State Management with Vuex
• Transitions and Animations
• Unit Testing
• Authentication and Authorization
• Server-Side Rendering
• Deployment

Section 8— Common Reusable Component (React)

Coming up soon.

• Building a Calendar Control
  1. Watch: Build a React Calendar Control
• Building a Data Table with Search, Sorting, Reorder columns by dragging, Column Template, Pagination, CRUD.
  Reading: Building a DataTable with React (Soon a tutorial to be published)
• Building common UI Controls
• Building drag and drop concepts (30 minutes)
  1. Watch: React drag and drop tutorial for beginners

Section 9— Performance Engineering (for lack of a term to use)

Section 10 — Soft Skills and Interview Preparation

Since every boot-campers have to appear for an interview (well most of them unless you are planning to do a startup, but still this skills will be useful) this section deals with some solid tips, resources to enhance the presentation and storytelling skills.

This is where you are nurtured to be a thorough professional from the budding coder!

Section 11— Live Project (This will be part of the study throughout and not a sequential activity)

The entire content will be based on building one large multi-tenant application and will be text and video based.

Distinguished Engineering Series — Building Unbreakable Software

The below will be the brief agenda for this series. The core aim being building software and applications that are resilient to changes.

Core Agenda

-Pure functions
-Abstracting object creation
-Handling Dynamic business rule changes
-Eliminate if/else, switch statements (where appropriate)
-Creating your own small DSL rule engine
-Dependency Injection
-SOLID Principles
-Dynamic module loading
-Plugins based approach to development
-Using key/value, hash table effectively
-Strategy and decorator pattern in detail.
-Template patterns for well defined life cycle.
-Object construction patterns
-API abstraction patterns
-Effective Singleton pattern
-Visitor pattern
-Unit Testing all aspects of code

Modus Operandi

Below is the approach that we will adapt to meet the above goals.

1. Use freecodecamp.org materials as a base starting point.
2. For every agenda identified above map to three great videos from the community and also publish a video to build some additional skills or to gain some in-depth insight.
3. All initial tutorials will be aimed towards a TDD approach(or at least we will try to put in an integration test)
4. We will set up a virtual support system, for those interested in following this course virtually from anywhere in the world.
5. We will plan a periodic webinar to address certain concepts or share more insights as needed. The calendar will be published.
6. Mandatory book reading (well, we can’ make mandatory for the outside world but would recommend for anyone who needs to succeed in this effort)

When will this be ready?

The early version of this curriculum for ReactJS is available. Others will be available from Mid June 2020. Though the contents will be randomly published on YouTube and medium until that time.

Most of our live projects are work in progress based on which this curriculum is being designed and together we will be making it live or a variation of it.

Initially, the backend we will be using is NodeJS, but parallel work on other backends like laravel, python, go will be accounted for as well.

What you can do?

If you are interested or think can help us out, feel free to leave a comment or share your thoughts.

*The full content is still being outlined. I am publishing this for early feedback from the community. This story will remain open for edit till we meet our goal.

Happy coding and let’s bring the coder in us alive!!

Updates (14-Oct-2018)

• The team for this activity is almost ready
• Initial source code at https://github.com/rajeshpillai?tab=repositories (Its a wip and the reviewing and refactoring will happen). It will be moved to a dedicated repository.
• Track this for support/early access https://medium.com/series/mastering-full-stack-course-progress-early-access-43c87f48477c
• Track this for activity log https://medium.com/series/mastering-full-stack-engineering-work-log-e9389f6fa3dd

Early Access Courses Published

Early access courses published as of today is listed below. Some free, some discounted as it supports the cost of content creation, coding etc during the early stage.

Please note all videos will be re-edited for quality purpose.

• Build Your Own React from Scratch
• ReactJS — Beyond The Basics

History

• 29-October-2019 — Reorganized Curriculum
• 20-September-2019- Added WIP maths for programmers/cs topics
• 27-October-2018-Added published course list
• 14-October-2018 — Updates and links
• 8-May-2018 — Corrections
• 25-April-2018- Updates and corrections

I have created a patreon account for community support of Full Stack Engineering Curriculum

https://www.patreon.com/unlearninglabs

Promotion: If you would like to support our open source curriculum Mastering Full Stack Engineering in 12 to 20 weeks ,then here is a special 10$ coupon for medium readers for my upcoming live ReactJS-Beyond the basics and JavaScript Deep Dive — Code Your Own ReactJS course on udemy.

✉️ Subscribe to CodeBurst’s once-weekly Email Blast, 🐦 Follow CodeBurst on Twitter, view 🗺️ The 2018 Web Developer Roadmap, and 🕸️ Learn Full Stack Web Development.