{"id":143,"date":"2025-06-05T13:40:00","date_gmt":"2025-06-05T13:40:00","guid":{"rendered":"https:\/\/nussbaumer-carolin.web.kslinz.at\/wp2025\/?page_id=143"},"modified":"2026-06-09T08:29:30","modified_gmt":"2026-06-09T08:29:30","slug":"computer-science","status":"publish","type":"page","link":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/?page_id=143","title":{"rendered":"Computer science"},"content":{"rendered":"\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nussbaumer-carolin.web.kslinz.at\/wp2025\/?page_id=35\">Media Design<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nussbaumer-carolin.web.kslinz.at\/wp2025\/?page_id=46\">Photography<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nussbaumer-carolin.web.kslinz.at\/wp2025\/?page_id=41\">ART<\/a><\/div>\n<\/div>\n\n\n\n<div class=\"alignnormal\"><div id=\"metaslider-id-236\" style=\"width: 100%;\" class=\"ml-slider-3-98-0 metaslider metaslider-flex metaslider-236 ml-slider ms-theme-default-base has-dots-nav\" role=\"region\" aria-roledescription=\"Slideshow\" aria-label=\"New Slideshow\" data-width=\"700\">\n    <div id=\"metaslider_container_236\">\n        <div id=\"metaslider_236\">\n            <ul class='slides'>\n                <li style=\"display: block; width: 100%;\" class=\"slide-237 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-237\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-wjydjeqa?file=index.ts\" target=\"_blank\" aria-label=\"View Slide Details\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012107.png\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-237\" title=\"SUE Robot\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div>In this project, we drew a simple robot shape on a gray background. We combined squares, circles, lines, and rectangles to create the image. This helped us practice drawing different shapes and using colors.<\/div><\/div><\/div><\/li>\n                <li style=\"display: none; width: 100%;\" class=\"slide-238 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-238\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-c4gf5ms4?file=index.ts\" target=\"_blank\" aria-label=\"Link to Stackblitz\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012213.jpg\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-238\" title=\"SUE For Schleife (squares)\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div>In this project, we used loops to draw shapes. We created 15 squares arranged diagonally on the canvas by using a for loop. This helped us learn how to repeat code to make patterns easily.<\/div><\/div><\/div><\/li>\n                <li style=\"display: none; width: 100%;\" class=\"slide-239 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-239\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-ipdeuvtq?file=index.ts\" target=\"_blank\" aria-label=\"View Slide Details\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012302.jpg\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-239\" title=\"SUE square pattern with loop\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div>Here we used a loop to draw 15 green squares, each smaller than the last. This created a pattern of squares\u00a0<\/div><\/div><\/div><\/li>\n                <li style=\"display: none; width: 100%;\" class=\"slide-240 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-240\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-jvk4gz9f?file=index.ts\" target=\"_blank\" aria-label=\"View Slide Details\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012348.jpg\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-240\" title=\"SUE line pattern\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div>In this project, we used a function with a <strong>while loop<\/strong> to draw horizontal lines across the canvas. Each time the function runs, the lines get a new random color.<\/div><\/div><\/div><\/li>\n                <li style=\"display: none; width: 100%;\" class=\"slide-241 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-241\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-l4dvqsqa?file=index.ts\" target=\"_blank\" aria-label=\"View Slide Details\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012422.jpg\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-241\" title=\"SUE circle grid\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div> <p>In this project, we used a function and two while loops to draw circles in a grid pattern. The number of circles in each row is chosen randomly.\u00a0<\/p> <\/div><\/div><\/div><\/li>\n                <li style=\"display: none; width: 100%;\" class=\"slide-242 ms-image \" aria-roledescription=\"slide\" aria-label=\"slide-242\" data-date=\"2025-06-07 23:27:16\"><a href=\"https:\/\/stackblitz.com\/edit\/p5-starter-uquh6uvy?file=index.ts\" target=\"_blank\" aria-label=\"View Slide Details\" class=\"metaslider_image_link\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/wp-content\/uploads\/2025\/06\/Screenshot-2025-06-08-012543.jpg\" height=\"300\" width=\"700\" alt=\"\" class=\"slider-236 slide-242\" title=\"Shapes inside shapes\" \/><\/a><div class=\"caption-wrap\"><div class=\"caption\"><div>In this project, we used a for loop to draw circles and squares inside each other. Each shape gets smaller and smaller and appears in the center of the canvas. We also used random values to change the colors.<\/div><\/div><\/div><\/li>\n            <\/ul>\n        <\/div>\n        \n    <\/div>\n<\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">you can click on the picture to get to the link<\/p>\n\n\n\n<div class=\"wp-block-group alignwide has-global-padding is-layout-constrained wp-container-core-group-is-layout-6de0f9d1 wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\"><\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center has-heading-1-font-size is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:1.5em\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<p class=\"is-style-abisko-tabular-nums has-heading-1-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:800;line-height:1\">1<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">st grade<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">HTML &amp; CSS<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">In the first year we focused on HTML &amp; CSS. We learned how to create websites using HTML for structure and CSS for styling. By the end of the year, we made our own websites. Mine can be found at <a href=\"https:\/\/nussbaumer-carolin.web.kslinz.at\/%C3%9Cbermich.html\" data-type=\"link\" data-id=\"http:\/\/nussbaumer-carlolin.web.kslinz.at.\/\">nussbaumer-carolin.web.kslint.at<\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\"><\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center has-heading-1-font-size is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:1.5em\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<p class=\"is-style-abisko-tabular-nums has-heading-1-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:800;line-height:1\">2<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">nd grade<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">JavaScript &amp; WordPress<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">In the second year, we focused on improving our skills with JavaScript and WordPress. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">With JavaScript, we learned how to make websites more dynamic and interactive. Using the online editor StackBlitz, we created moving elements on the screen, generating random colors and making emojis appear at random positions. For example we programmed Smiley faces that moved across the page or changed their color.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We also worked eith WordPress, I built my own website using block editors, themes and plugins. We experimented with layouts and added extra styling using CSS. <\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group alignwide has-global-padding is-layout-constrained wp-container-core-group-is-layout-6de0f9d1 wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\"><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-group alignwide has-global-padding is-layout-constrained wp-container-core-group-is-layout-6de0f9d1 wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\"><\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center has-heading-1-font-size is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:1.5em\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<p class=\"is-style-abisko-tabular-nums has-heading-1-font-size wp-block-paragraph\" style=\"font-style:normal;font-weight:800;line-height:1\">3<\/p>\n\n\n\n<p class=\"has-medium-font-size wp-block-paragraph\">rd grade<\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading\">Javascript<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">In the third year, we worked with Javascript. In the first semester we covered a lot of the basics. In the second semester, we programmed, with the help of AI, a game. The game is about sustainibility and features a turtle as the main character.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:5%\"><\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center has-heading-1-font-size is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:1.5em\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-79fb870f wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<p class=\"wp-block-paragraph\"> <\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<h4 class=\"wp-block-heading is-style-default\">Turtle Survival<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Game Instructions<\/strong><br>Choose a level (1\u20133).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br><strong>Puzzle Phase<\/strong><br>Click a symbol. Click an adjacent symbol to swap them.<br>You can only make a swap if it creates a row or column of three matching symbols.<br>Bring the turtles to the bottom. Collect the litter.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br><strong>Pipe Phase<\/strong><br>Avoid the falling trash.<br>Use the arrow keys to control the turtle.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"> <\/p>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div style=\"max-width: 900px; margin: 0 auto;\">\n  <iframe \n    src=\"https:\/\/carolin866.github.io\/Turtle-Survival\/\"\n    width=\"100%\"\n    height=\"700\"\n    style=\"border:0; border-radius:12px;\"\n    allowfullscreen\n    loading=\"lazy\">\n  <\/iframe>\n<\/div>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nussbaumer-carolin.web.kslinz.at\/wp2025\/?page_id=7\">GO Back<\/a><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>you can click on the picture to get to the link 1 st grade HTML &amp; CSS In the first year we focused on HTML &amp; CSS. We learned how to create websites using HTML for structure and CSS for styling. By the end of the year, we made our own websites. Mine can be [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-143","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/pages\/143","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=143"}],"version-history":[{"count":27,"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/pages\/143\/revisions"}],"predecessor-version":[{"id":640,"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=\/wp\/v2\/pages\/143\/revisions\/640"}],"wp:attachment":[{"href":"https:\/\/nussbaumer-carolin.webserver.kslinz.at\/wp2025\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=143"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}