Front-end Web Programming

Front-end Web Programming
Licence InformatiqueParcours Computer Sciences (UFAZ) (délocalisé en Azerbaïdjan)

ComposanteUFR de mathématique et d'informatique

Description

The course objective is learn how to design a responsive website in HTML and CSS, optimised for mobiles and desktops, taking into account accessibility. A semantic approach is favoured for both content elements and content organisation elements.
Acquire the basics of Javascript in terms of algorithms. Understand how Javascript accesses the D.O.M. in order to manipulate and modify it. Use APIs to interact with the HTML document, and exploit online services or sensor data from a mobile phone.

Compétences requises

Basic understanding of the web (web browsing, web servers, etc.), Basic computer skills (file management, etc.), Hands-on experience of a text editor, Knowledge of web browsers (displaying source code, etc.). Basic knowledge of HTML and CSS is a plus. Before starting with Javascript, you need to know HTML and understand the D.O.M. (Document Object Model). Understanding of basic programming concepts is a plus.

Compétences visées

  • Knowledge of HTML and CSS
  • Mastery of the Javascript programming language in procedural mode (algorithmic), as well as in terms of object-oriented programming, with the objects of the JS core,

Syllabus

Semantic approach to HTML: - the semantic elements of content: titles, paragraph, hypertext link, ... . - semantic elements for organising content, including those of HTML5: header, footer, nav, etc., with the aim of structuring the content of the HTML document. - taking accessibility into account during web development CSS styles and design - CSS: CSS properties and common selectors: elements, class, id and inheritance. Complex selectors: attributes, pseudo-class, pseudo-elements. Selector combiners - advanced design using CSS Grid and CSS Flexbox HTML forms form elements and attributes Remote web hosting, FTP transfer Javascript as a procedural, algorithmic programming language, then as an object-oriented programming language with the objects of the JS kernel: JS syntax, JS console, instructions, variables and constants, control structures (loop, conditional test), user-defined functions JS core objects: Date, String, Array, Math, etc., their properties and methods Interaction of Javascript with the D.O.M. (Document Object Model) Basic methods for accessing an HTML element as a JS object (getElementById, ...), properties and methods for manipulating HTML elements, dynamic modification of CSS styles by API (Application Programming Interface) Use of Javascript APIs to interact with the D.O.M.: querySelector, classList, etc. Advanced APIs: localStorage, geolocation, APIs linked to mobile phone sensors (accelerometer, etc.), etc. data in JSON format, properties and methods for manipulating JSON data Dynamic writing of HTML content: createElement(), createTextNode(), appendChild(), setAttribute() and getAttribute() methods template literals, forEach() methods, etc. JS event management JS Framework approach

Bibliographie

  • HTML5 and CSS3: Building Responsive Websites. Firdaus, Thoriq, Frain Ben Lagrone Benjamin. Packt Publishing, 2016.

  • Mastering CSS. Finelli, Rich. Packt Publishing, 2017.

  • JavaScript by Example. S, Dani Akash. Packt Publishing, 2017.

Contacts

Responsable(s) de l'enseignement