Web development topics and references

Front-end

HTML 5

• Anatomy of websites.
• HTML syntax and tag names.
• HTML boilerplate and doctype.
• Unorder, order lists.
• Images, hyperlinks, and anchor tags
• HTML divs, and tags.
• Inline style and CSS styling.

DOM (Document object model)

• Tree HTML structure
• Moving through the document with object notation
• Manipulation of HTML elements with DOM.

CSS 3

• Cascade style sheets
• CSS selectors and properties
• Inline, internal, and external CSS
• CSS code conventions
• CSS syntax and structure
• CSS specificity and style hierarchy
• Class and ids
• CSS static, relative and abs. positioning
• Font style and web fonts
• CSS selector priority

Bootstrap

• A CSS framework for responsive websites
• Balsamiq and wireframe websites
• Fundamentals of UI (user interface)
• Bootstrap container, carousels, cards, and navigation bars

---

---

Back-end Development

JavaScript ES6

• JavaScript ECMAScript 6 fundamental (pure JS as vanilla JS)
• Variables, data types, strings, numbers
• Logical operators, loops, collections, conditionals
• Functions and invocation patterns
• Intermediate JS, expressions, statements, operators, and declarations
• OOP
• JS objects and prototypes
• “This” keyword, scope, and closure
• Objects and prototypes

jQuery

• jQuery as a JS framework library
• Functions in jQuery
• jQuery knowledge for interactive websites

Node JS

• Back-end development with MVC (model view controller) framework
• Applied concepts, data types, objects, methods, OOP, classes in contact with back-end development
• Server-side JS, Node command line
• NPM (node package manager)
• JS build processes, event loop and emitters
• File system navigation
• Modules
• Native node drivers

Express JS

• Back-end web server framework for Node JS
• Create Node and Express based servers
• RESTful Routing with Express (Representational state transfer)
• Middleware for Node applications

APIs

• Application programming interface
• HTTP
• Calling, Reading and authentication API
• Server to server comms

EJS

• Understand EJS (embedded JS) with Node and Express
• Templating with EJS, templates
• Passing data from server to template
• EJS layouts/partials with EJS

---

---

Databases

• Db fundamentals
• Data relationships, design a data model
• Relational dBs, alternative dBs
• Entity relationship modelling (ERM), Object relational mapping (ORM)

SQL Databases

• Database schemas
• CRUD (create, read, update, delete)
• Database joins
• Querying SQL dBs

No SQL databases

• Serialization
• No SQL data model
• Document dBs (Mongo dB)
• CREUD, No SQL conventions
• Mongo Shell and command line
• Mapping relationships
• Object data modeling library (Mongoose)

Deployment

• Heroku , Mongo dB Atlas

---

---

Projects

REST API

• REST api guidelines from zero
• Mongo dB GUI Studio 3T
• Implement get, post, put, patch, delete API
• Usage of chained route handlers from Express

Authentication and Security

Advanced

React

• Learn front-end development with React.
• Understand when and how to use React Components.
• Learn to pass Props and work with them.
• Learn to write JSX and understand JSX syntax.
• Learn about the React DOM.
• Learn State Management in React.
• Learn about React Hooks.
• Learn about conditional rendering in React.
• Understand the difference between class and functional
• components.

JS advanced

• Arrow Functions
• Map/Filter/Reduce
• Find/FindOne/FindIndex
• Import/Export and Modules
• Object and Array Destructuring
• Spread Operator

Reference:

For all general purpose:

1. https://www.programiz.com/
2. https://www.w3schools.com/
3. https://devdocs.io/

DOM:

1. https://en.wikipedia.org/wiki/Document_Object_Model

Boostrap:

1. https://www.geeksforgeeks.org/bootstrap-4-complete-reference/

Js:

1. Haverbeke, M. (2018). Eloquent JavaScript: a modern introduction to programming. No Starch Press.

Git:

1. https://git-scm.com/book/en/v2

Roadmaps: Front-end

1. https://roadmap.sh/frontend/