Front-End Development (5 cr)

Evaluation scale

H-5

Content scheduling

Contents

I. JavaScript (Lectures and personal exercises)

- Basics
- Strings
- Objects, destructuring
- Arrays, array operations
- Programming functions
- Error handling
- DOM, event handling
- Modules
- Asynchronous programming
- Tools

II. React (Lectures and a teamwork)

- Basics
- JSX
- Components
- Modularization
- Tools
- Managing state
- Hooks

III. Teamwork: A simple single page web application with React (without backend)

7 personal JavaScript exercises.
React-based Teamwork.

Objective

After completing the course the student:
- can program JavaScript programming language
- can use the React application framework
- is able to design modular front-end software
- knows the special features of front-end development
- is able to use efficient and modern programming tools

Content

- Basics of JavaScript
- Modern features of JavaScript
- The basics of the React library
- Front-end software design and modularization
- Front-end development features
- Development tools

Materials

The course material (Only selected parts from the books)
*
Eloquent JavaScript
Marijn Haverbeke
No Starch Press; 3 edition (December 4, 2018)
Available on the Net: http://eloquentjavascript.net
*
Professional JavaScript for Web Developers
5th Edition
Matt Frisbie
Published by Wrox
Available in ProQuest EBook Central
*
Selected project-based React-tutorial
*
Learning React : Modern Patterns for Developing React Apps
2nd edition
Alex Banks and Eve Porcello
Available in ProQuest EBook Central
*

Teaching methods

- reading the course books and other reading material, watching videos
- participating in the lectures
- programming together with instructor
- programming alone
- participating in the teamwork

Exam schedules

No exam

Completion alternatives

The student can complete the course by demonstrating his knowledge and skills of the subjects of the course, for example with the work samples they have made. However, this must be agreed with the instructor during the first 4 weeks of the course.

The student can include a corresponding course taken elsewhere at some educational institution that is acceptable by our educational institution. This happens via AHOT process. Also this matter should be initiated immediately at the beginning of the course.

Student workload

39 h contact lessons (Each 3h = 2h learning and 1h individual working with the presence of the instructor)
4 h presenting and following team works
40 h preparing teamwork
54 h doing personal exercises

Evaluation methods and criteria

The maximum number of points available from course is 120.

Of that maximum, 70 points comes from individual exercises, 30 points from teamwork, and 20 points from being present on the lectures.

The course evaluation scale is the following:

Min points -> Grade

0 -> 0
40 -> 1
56 -> 2
72 -> 3
88 -> 4
104 -> 5

Please note this additional condition: You must get at least 20 points from the exercises and 10 points from the teamwork to pass the course.

The points from being present are calculated using the following scale:

Percentage of being present on the normal lectures -> points

20% -> 5
40% ->10
60%->15
80%->20

Please also note that by being present you can earn some of the points available from the individual exercises working together with the instructor.

You must be present in demonstration. It does not accumulate your points of being present. If you are not present in the demonstrations, then there is a reduction of 50 % of the points of your returned exercises on these demos. There is also a reduction of 50 % for exercises that are returned late. No exercises are accepted after the end date of the course implementation. After the end date of the course, no substitute or supplementary assignments will be given either. The student must therefore make sure that he collects enough points from different performances during the time of the course.

Failed (0)

The student has not managed to accumulate enough points to pass the course during the time of the course. Consequently, they have not been able to demonstrate the kind of competence on the basis of which an acceptable grade could be given.

Assessment criteria, satisfactory (1-2)

The student knows the application areas and the application environments of the JavaScript programming language
The student knows the basics of the modern JavaScript programming language
The student knows at least of the central front-end libraries of the JavaScript programming language
The student knows some of the key tools used in JavaScript programming
The student knows how to program simple applications with JavaScript or its library

Assessment criteria, good (3-4)

The student knows the application areas and the application environments of the JavaScript programming language
The student masters the basics of the modern JavaScript programming and some of the JavaScript's advanced features
The student can apply one of the central front-end libraries of the JavaScript programming language
The student knows how to search for information to develop his JavaScript and programming skills and to solve problems
The student knows how to use some key tools used in JavaScript programming
The student knows how to program applications with JavaScript and its libraries
The student knows how to work in a JavaScript programming project

Assessment criteria, excellent (5)

The student knows the application areas and the application environments of the JavaScript programming language
The student masters the of the modern JavaScript programming extensively and can utilize efficiently its libraries
The student knows how to efficiently search for information to develop his JavaScript and programming skills and to solve problems
The student knows how to effectively use and search for different tools used in JavaScript programming
The student knows how to design and program modularized applications with JavaScript and its libraries
The student knows how to work proactively and responsibly in a JavaScript programming project

Qualifications

WWW-perusteet (HTML5, CSS)

Further information

itsLearning and email