This course introduces advanced concepts of visual and event-oriented programming with a strong focus on modern full-stack web development. Students will gain hands-on experience in client-side programming with JavaScript, TypeScript, and React, as well as server-side development with Deno.js. The course also explores the design and integration of web services, and introduces open-source business intelligence and monitoring tools such as Grafana and Apache Superset. Emphasis is placed on practical skills through in-class assignments, and a final project involving plugin development for these platforms.
Prerequisite(s)
Course Code Course Name…
Corequisite(s)
Course Code Course Name…
Special Requisite(s)
The minimum qualifications that are expected from the students who want to attend the course.(Examples: Foreign language level, attendance, known theoretical pre-qualifications, etc.)
Instructor(s)
Instructor Dr. Mehmet Fatih YÜCE , Instructor Dr. Mehmet Fatih YÜCE
• React + TypeScript basics.
• Create first components for Task Manager (Task list, Task form).
3. Week
• React state & props.
• Add task creation and deletion features.
4. Week
• Review
• React advanced.
• Conditional rendering,
• Mapping lists.
• Add task status (to-do, in progress, done).
5. Week
• State management with Context API.
• Implement task filtering by status.
6. Week
• Local data persistence (localStorage).
• Prepare for backend integration.
7. Week
• Deno.js introduction.
• Build a simple server and REST API for tasks.
8. Week
• Midterm exam
9. Week
• Backend CRUD with Deno.js (create, read, update, delete tasks).
10. Week
• Frontend-backend integration.
• Connect React app with Deno API.
11. Week
• Grafana and Apache Superset introduction.
• Export Task Manager data to JSON/CSV.
12. Week
• Review
• Plugin development basics.
13. Week
• Visualize task data (completed vs pending tasks) with Grafana/Superset.
14. Week
• Final project consolidation and demo presentations (if needed).
• Final report preparation.
15. Week
• Final exam
16. Week
17. Week
Assessments
Evaluation tools
Quantity
Weight(%)
Midterm(s)
1
25
Final Exam
1
20
Program Outcomes
PO-1
Adequate knowledge in mathematics, science and engineering subjects pertaining to the relevant discipline; ability to use theoretical and applied information in these areas to model and solve engineering problems.
PO-2
Ability to identify, formulate, and solve complex engineering problems; ability to select and apply proper analysis and modelling methods for this purpose.
PO-3
Ability to design a complex system, process, device or product under realistic constraints and conditions, in such a way so as to meet the desired result; ability to apply modern design methods for this purpose. (Realistic constraints and conditions may include factors such as economic and environmental issues, sustainability, manufacturability, ethics, health, safety issues, and social and political issues according to the nature of the design.)
PO-4
Ability to devise, select, and use modern techniques and tools needed for engineering practice; ability to employ information technologies effectively.
PO-5
Ability to design and conduct experiments, gather data, analyse and interpret results for investigating engineering problems.
PO-6
Ability to work efficiently in intra-disciplinary and multi-disciplinary teams; ability to work individually.
PO-7
Ability to communicate effectively, both orally and in writing; knowledge of a minimum of one foreign language.
PO-8
Recognition of the need for lifelong learning; ability to access information, to follow developments in science and technology, and to continue to educate him/herself.
PO-9
Awareness of professional and ethical responsibility.
PO-10
Information about business life practices such as project management, risk management, and change management; awareness of entrepreneurship, innovation, and sustainable development.
PO-11
Knowledge about contemporary issues and the global and societal effects of engineering practices on health, environment, and safety; awareness of the legal consequences of engineering solutions.
Learning Outcomes
LO-1
Knowing static and dynamic (user-interactive) web pages and the difference between them
LO-2
Knowing the basic components of a dynamic web page and the most current web technologies in this context
LO-3
Being able to program dynamic web pages in HTML, React, SQLite, Deno.js environments.
