Published on

Web Developer Roadmap 2022

Authors

join our community

Here we go

Web Developer Roadmap 2022

How to Learn Web development?

In web development, there are mainly four ends.

  1. Backend
  2. Frontend
  3. Database
  4. Cloud(server)

This roadmap consists of widely used technologies/frameworks for frontend and backend. It also includes overview about cloud(AWS) and some information about server.

Table of contents

  • Sprint 1: Version control, Basic web technologies and coding conventions
  • Sprint 2: Docker, Databases and PHP
  • Sprint 3: Golang
  • Sprint 4: Node.js
  • Sprint 5: Vue.js
  • Sprint 6: Useful concepts

Sprint 1 - Version control, Basic web technologies and coding conventions

Practical 1.1

  • Perform following operations in gitlab
    • Create a repository to GitLab
    • Add new files into a git repository
    • Modify some files and commit them into a git repository
    • Push in a git repository
    • Create Commits, tags, and branches
    • Checkout new branch
    • Merge branch into another
    • Rebase
    • Create merge request

References

Practical 1.2

  • UI Design
    • Design static UI given in the link
    • Design responsive UI given in the link

References

Practical 1.3

  • Unit converter
    • Create a unit converter that should take input from users and output the value in the asked unit (conversion units can be centimeters, meters, and kilometers)

References

Sprint 2 - Docker, Databases and PHP

Practical 2.1

  • Install MySQL using Docker
  • Install MongoDB using Docker

References

Practical 2.2

  • Perform following queries in MySQL

    • Create a table named students with fields id, first_name, last_name, standard, percentage, interest, etc... and insert data into it
    • Create table student_attendances with fields id, created_at, presence/absence fields and insert data into it
    • Prepare queries to find student's presence/absence on a particular day
    • Find total absence/presence of every student
    • Find absent students with a percentage lower than 70.

  • Perform following queries in MongoDB (Can use MongoDBPlayground to peform queries)

    • Create a collection named students with fields id, first_name, last_name, standard, percentage, interest, etc... and insert data into it
    • Form a query to find students with a percentage lower than 70 and interest in sport.
    • Count the total students with a percentage above 70

References

Practical 2.3

  • Create a Blog application with following requirements
    • It should have two sides
        1. Admin
        1. User
    • Implement Register and login functionality for both user and admin
    • Admin can add posts ( post fields - title, description, created_date, author, category, image )
    • Admin can decide which user can see the post
    • Added Posts will be visible on user side (latest posts first)

References

Basic Concepts

  • Installation WAMP/MAMP/XAMPP
  • How it exactly works ?
  • Basic Syntax
  • Variables, Constants, Operators & Control Structures
  • Conditions, Loops, Switch cases
  • Arrays, String and various string functions
  • Functions
  • Includes & Required
  • Classes & Objects & Constructors
  • Namespaces
  • Extensions
  • Exceptions
  • JSON Encode & Decode
  • Sessions
  • Cookies
  • File Manipulation
  • Indexed Array vs Associative Array
  • Object vs stdObject
  • Timeout of PHP script

Predefined variables

Advanced options

  • Interfaces
  • Traits
  • Crons
  • Composer
  • php.ini tweaks

Keywords

  • Private
  • Public
  • Static

Sprint 3 - Golang

Practical 3.1

Basic concepts

Advance concepts

  • Maps in Go
  • Concurrency and Goroutine
  • defer
  • Error handling
  • Panic and recover
  • Reflection
  • Type conversion
  • File manipulations
  • Logging
  • Authentication with JWT (JSON Web Token)

Packages

Sprint 4 - Node.js

Practical 4.1

  • Implement one-one real time chat application

Practical 4.2

References

Sprint 5 - Vue.js

Practical 5.1

References

  • Get started with Vue.js

  • Concepts

    • What is vue.js ?
    • Getting started
    • Installation
    • Application and component instances
    • Template syntax
    • Data properties and Methods
    • Computed Properties and Watchers
    • Class and Style Bindings
    • Conditional rendering, conditional style binding
    • List rendering
    • Event Handling
    • Form input bindings
    • Component Basics
    • Props
    • Component registration
    • Slots
    • Template refs

Sprint 6 - Useful concepts

Concepts

Cloud

Additional

Source

canopas

Share this post:

Join our community:
• • •