FI1BDFT10 Front-end Technologies 1

FI1BDFT10 Front-end Technologies 1

  • Course description
    • Course code
      FI1BDFT10
    • Level of study
      5.1
    • Program of study
      Back-End Development 1
    • Credits
      10
    • Course coordinator
      Frederick Johannes Botha, Joshua Wiggill
Teaching term(s)
2024 Autumn
Authors
Joshua Wiggill
About the Course

The course provides the candidate with understanding and practical knowledge in coding with HTML and CSS and an introduction to using JavaScript as a Front-end language. The candidates will be introduced to the concepts of user interaction and interface design. While covering the fundamentals of the JavaScript language, the candidates will learn the basics of DOM manipulation and how to interact with REST APIs to retrieve data. This Front-end course will draw distinctions between the roles of Front-end developers and Back-end developers, ensuring that candidates are able to distinguish the roles easily. They will also learn how the two roles cooperate within web development. The course will also cover the usage of Git as a version control tool for coding.

Through this course, the candidates will learn to construct simple static web pages, that is, web pages consisting of only HTML, CSS, and JavaScript. They will learn about the DOM and how it is reflected in the browser rendering of a web page. They will then use JavaScript to manipulate the DOM, and this creates a website that “reacts” to a user. They will use JavaScript to retrieve data from a provided REST service and again manipulate the DOM based on the retrieved data.

Course Learning Outcomes
Learning outcomes - Knowledge

The candidate:

  • has knowledge of the concepts, processes, and tools that are used to build static web pages
  • has knowledge of concepts, processes and tools that are used in development in the JavaScript language
  • has knowledge of concepts of the Document Object Model (DOM)
  • has knowledge of the concepts, processes, and tools that are used to interact with RESTful services
  • has knowledge of concepts, processes, and tools of git version control software
  • has insight into the HTML/CSS and ECMAScript specifications
  • can update his/her vocational knowledge in HTML/CSS
  • can update his/her vocational knowledge in  JavaScript language
Learning outcomes - Skills

The candidate:

  • can apply vocational knowledge of JavaScript to manipulate the Document Object Model (DOM) and to retrieve and display data from existing REST services in static web pages
  • masters relevant vocational tools, materials, and techniques to create static web pages using HTML and CSS
  • masters JavaScript tools, materials, techniques, and styles used to enhance functionality in static web pages both as inline scripting and as external script files
  • masters Git source control tools, materials, techniques, and styles that are used to create and work with a version-controlled project
  • can find informational and material that is relevant to extending JavaScript functionality in static web pages through the use of third-party libraries
General Competence

The candidate:

  • understands the ethical principles that apply when creating JavaScript web solutions intended for public use
  • can carry out work based on the needs of a Junior JavaScript developer
Teaching and Learning

In this course, the following teaching and learning methods can be applied, but are not limited to:

  • Lecture: Educator-led presentations or activities providing knowledge, skills, or general competencies in the subject area.
  • Group work: Collaborative activities where students work together to solve problems or complete tasks.
  • Tutoring: One-on-one or small group sessions with an instructor for personalized guidance and support.
  • Student presentations: Opportunities for students to demonstrate their understanding of course material by presenting to peers.
  • Online lessons: Digital content delivered via an online learning platform.
  • Guidance: Individualized advice and direction from instructors to support students in their learning journey.
  • Workshops: Practical sessions focused on hands-on application of theoretical concepts or skills.
  • Self-study: Independent study where students engage with course material on their own without any teacher support.
Reading list

Teaching materials, reading lists, and essential resources will be shared in the learning platform and software user manuals where applicable.

Assessments
Form of assessmentGrading scaleGroupingDuration of assessment
Course Assignment
Pass / Fail
Individual
1 Week(s)