The training content is divided into the following modules:
- Module 1. Web development and project management (60h): develop websites based on HTML and CSS using a professional development environment and project management tools.
- Module 2. Javascript (ES6) (100h): create interactive web projects with HTML, CSS and Javascript (ES6) in order to lay the foundations of web programming.
- Module 3. FrontEnd Framework (Vue.js) (80h): use a Javascript-based web development framework, such as Vue.js, and extrapolate the process to other frameworks based on experimentation.
Module 1. Web development and project management
This 60-hour module aims to develop websites based on HTML and CSS using a professional development environment and project management tools. Specifically, in this module the following knowledge will be acquired:
Identification of Internet elements:
- History of the Internet and web development.
- Evolution of browsers.
- Client and Server.
- protocols HTTP.
Application of HTML markup language for web layout:
- History of HTML.
- HTML elements: HTML, head, body and metadata.
- Content, text and multimedia separation elements.
- Tables and forms.
- Block vs Inline.
- Attributes of HTML elements.
- Document Object Model (DOM).
Interpretation of web accessibility standards and guidelines:
- Semantic elements.
- Technical aids and ways of interaction.
- Introduction to WCAGs 2.1.
- Introduction to a11y project and including components.
Cascading style sheet language (CSS) application for web layout:
- History of CSS.
- CSS anatomy.
- Specificity.
- Pseudo-selectors and pseudo-basic elements.
- Styles for texts and forms.
- Colors and contrasts.
- Model Box.
- Units (absolute and relative).
- Positioning.
- Layouts.
- Responsive web design.
- Flexbox.
- CSS Grid.
- Use of transitions.
- Use of animations.
Analysis of designs made with graphic design tools:
- Design files (provided by Zeplin, AdobeXD, etc.).
- Prototype design with graphic design tools reproducing it through code.
Characterization of the environments, phases and tools needed to carry out projects:
- Environments, phases and documentation of a project.
- Methodologies for eliciting user requirements.
- Task planning in development projects.
- Collaborative software development environments.
List of version control knowledge and code repositories, such as GitHub:
- Introduction to Git Version Control.
- Basic syntax.
- GitFlow.
- GitHub.
Module 2. JavaScript (ES6)
This 100-hour module aims to create interactive web projects with HTML, CSS and Javascript (ES6) in order to lay the foundations of web programming. Specifically, in this module the following knowledge will be acquired:
Characterization of the fundamentals of Front End programming: Javascript:
- History and evolution of Javascript.
- Variables (var, let and const).
- Data types: Boolean, Number, String, Data, undefined, BigInt and Symbol.
- Objects.
- Special values: null, NaN and Infinity.
- Operators and operator precedence.
- expressions
- Flow control block, and error control / treatment.
- Scopes (including hoisting).
- Functions (first-class functions, nested and closed functions, anonymous functions, callback, arrow functions and this).
- Event management (event bubbling and capture).
- Javascript and DOM: how HTML, CSS and Javascript are related.
Application of the most advanced elements of Javascript:
- Legacy based on prototypes.
- Inheritance in ES6.
- Functional programming: map, filter and reduce.
- Modules and elements introduced in ES6: desetructurador, spread, etc.
Interpretation and rewriting of calls, data and AJAX code:
- Callback.
- promises
- Asynchronous programming, HTTP, REST API and Fetch API.
Code reproduction of prototypes made with graphic design tools:
- Task planning in development projects.
- Code writing and debugging.
- Collaborative software development environments.
Third-party code manipulation:
- Comparison of existing codes and solutions.
- Third party technical documentation.
Preparation of technical documentation and Javascript language user:
- Documentation for the end user of an application.
- Technical documentation for programmers.
Module 3. FrontEnd Framework (View.js)
This 80-hour module aims to use a Javascript-based web development framework, such as Vue.js, and extrapolate the process to other frameworks based on experimentation. Specifically, in this module the following knowledge will be acquired:
Distinction of Front End web development frameworks:
- History and evolution of Front End web development frameworks.
- Comparison of Vue.js, React and Angular.
Identification of the common elements that appear in the various frameworks:
- Data binding.
- Reactivity.
- templates.
- components
- routing.
- State management.
Using a Front End framework, in particular Vue.js:
- Data reactivity / two-way binding.
- templates.
- Interpolation.
- directives
- Conditional rendering.
- Events.
- Computed properties, Watchers.
- components
- registration.
- Props.
- Custom events.
- slots.
- routing.
- Flow-like state management.
Reproduction with a framework of prototypes made with graphic design tools:
- Task planning in development projects.
- Writing and debugging code
- Collaborative software development environments.
Third-party code manipulation:
- Comparison of existing codes and solutions.
- Third party technical documentation.
Preparation of technical and user documentation of a framework:
- Documentation for the end user of an application.
- Technical documentation for programmers.