# Losse Lessen # HTML Basics ### HTML tags [![image-1662914139884.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662914139884.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662914139884.png) ### Self closing tags #### (voorbeelden)
#### **Tag** #### Betekenis
#### **<br>** of **<br />** #### naar volgende regel
#### **<img>** of **<img />** #### plaatje invoegen
#### **<meta>** of **<meta />** #### informatie over pagina
#### **<hr>** of **<hr />** #### horizontale lijn
#### **<input>** of **<input />** #### vraag gebruiker om input
### Link [![image-1662914211836.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662914211836.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662914211836.png) # HTML Table In deze oefeningen leer je een tabel maken en leer je de atrtibuten *colspan* en *rowspan* gebruiken. ### Inleiding Maak de volgende tabel in HTML en zorg ervoor dat de tabel correct is. Gebruik <table border=1> en controleer of alles cellen netjes omlijnt zijn. ##### goed
aaabbbccc
dddeeefff
##### fout
aaabbbcccddd
aaabbb
Je kunt je html table code ook controleren met: [https://wet-boew.github.io/wet-boew-legacy/v3.1/demos/tableparser/validator-htmltable.html](https://wet-boew.github.io/wet-boew-legacy/v3.1/demos/tableparser/validator-htmltable.html) ### Opgave 1 Maak de volgende tabel [![image-1662913109107.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662913109107.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662913109107.png) ### Opgave 2 Verander de headers *Voornaam* en *Achternaam* en maak daar één cel van en noem die N*aam*. Tip: maak gebruik van de td attribuut *colspan (*google zoektermen: **html colspan**). [![image-1662913260381.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662913260381.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662913260381.png) ### Opgave 3 Voeg een regel toe [![image-1662913615331.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662913615331.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662913615331.png) en combineer dan de klas op de tweede en derde regel Tip: maak gebruik van de td attribuut *rowspan**.*** [![image-1662913513038.png](https://www.roc.ovh/uploads/images/gallery/2022-09/scaled-1680-/image-1662913513038.png)](https://www.roc.ovh/uploads/images/gallery/2022-09/image-1662913513038.png) --- Table code in code <> of this page. # Wat is leerplein? #### Sotware developer wordt je door het te doen net als fietsen! Tijdens het Leerpein kan je dus *meters maken.* Je leert ook je eigen werk plannen, zelfstandig werken en zelfstandig problemen oplossen. Alle 1ste klassen zullen 3 uur de tijd hebben om huiswerk en eventueel andere werkzaamheden te doen die te maken hebben met de AO vakken. Tijdens de Leerpleinuren werk je zelfstandig, help je elkaar en kun je als je er niet uit komt één van de docenten om hulp vragen. ### De afspraken - Leerplein is *verplicht*. - Leerplein is in de eerste plaats om je *huiswerk* te maken voor je AO/Software Development vakken. - Als je de leerpleinuren anders wilt besteden dan is daar ruimte voor maar dat moet wel in overleg met de docenten en het dient in je *planning* (volgend punt) te worden opgenomen. - Tijdens de leerpleinuren maak je een [*planning* ](https://www.roc.ovh/attachments/18)in Excel, zie bijlage. In de planning plan je werk voor de komende drie uur. Aan het eind van de drie uur bepaal je in hoeverre je je planning hebt gehaald. Dat vul je weer in. Je planning lever je na elk leerplein-les in via *Teams* 'Leerplein'. Je planning en werkhouding tijdens de les wordt beoordeeld! - Tijdens leerplein werk je *zelfstandig*; als je er niet uit komt dan ga je zelf op *onderzoek* uit, daarna vraag je je *klasgenoot* en pas in de laatste plaats vraag je hulp aan één van de docenten. - Als je al het AO huiswerk af hebt dan mag je: ander huiswerk maken, aan andere IT projecten werken of de AO docenten hebben extra plus werk. \-- # Plus Opdrachten *Hieronder staan extra opdrachten die kunnen worden gedaan tijdens de Leerpleinuren als al het verplichte huiswerk voor de AO vakken is afgerond.* #### Voor de Linux lessen: Installeer Ubuntu Server en MobaXterm, volg de instructie op: [https://www.roc.ovh/books/linux-1ff/page/ubuntu-onder-vmware](https://www.roc.ovh/books/linux-1ff/page/ubuntu-onder-vmware) #### Voor de JavaScript lessen: Zoek uit wanneer de onderstaande JavaScript errors zich voordoen en hoe je ze kunt oplossen: 1. RangeError 2. ReferenceError 3. SyntaxError 4. TypeError Bonusvraag: 1. Leg uit wat een URIError is en wanneer je deze krijgt. Kopieer de bovenstaande Errors naar een Word-/text document, beantwoord de vragen volledig en lever de opdracht voor het einde van het leerplein in via je studentenmail. De antwoorden kun je mailen naar # Introductie ### Presentatie: [https://view.genial.ly/5f3a579db225450d815cd7cd](https://view.genial.ly/5f3a579db225450d815cd7cd) (1) programma (2) Overeenkomsten - prijsje (3) SLB'er (2) (4a) Rooster - let ook vooral op Teams! (4b) Rooster volgende week (5) Leermidellen (6) Schoolregels (7) Corona-regels (8) Donderdag - let op teams (9) Vrijdag Eagledev (online) (10) [https://talnet.sharepoint.com/sites/StartNieuweSchooljaar](https://talnet.sharepoint.com/sites/StartNieuweSchooljaar) (11) 13:30 uur pasfoto (12) Namenspel (13) Over de streep (buiten) (14) Stelling ### WiFi Eerst registratie.talnet.nl (user/wachtwoord) van mail EduRoam log aan met nieuwe wachtwoord ### Office Installeren (thuis) **Mijn Account** (rechts boven) als je bent aangelogd in [talnet.sharepoint.com](https://www.roc.ovh/talnet.sharepoint.com). en dan **Office Apps** ### Teams Installeren Via wafel menu (link boven in talnet.sharepoint.com) en dan Teams Ook installeren op mobiel ### Hoe werken met Teams Portaal voor tallent op Talnet -> Les op afstand ->... alles over Teams voor studenten Kijk naar video (staat op de site): [https://web.microsoftstream.com/embed/video/e02d1404-906c-4db0-8bfe-f3668638c502?autoplay=false&showinfo=true](https://web.microsoftstream.com/embed/video/e02d1404-906c-4db0-8bfe-f3668638c502?autoplay=false&showinfo=true) Kijk op de agenda in Teams. ### Leermidellenlijst [www.studers.nl](http://www.studers.nl) ROC van Amsterdam - Amstelveen - 2020-2012 - communicatietechnologie - applicatieontwikkelaar 1ste jaars [https://www.studers.nl/boekenlijst/ROC-van-Amsterdam/2020/BL099949/Software-Developer-Niveau-4-1e-jaars-LCTAOO0A-0B-0C-0D](https://www.studers.nl/boekenlijst/ROC-van-Amsterdam/2020/BL099949/Software-Developer-Niveau-4-1e-jaars-LCTAOO0A-0B-0C-0D) Laptop - geen Chromebook! - minimum is Win19, 8GB RAM en 250 GB SDD \#start [TeamsMe](sip:t.monincx@rocva.nl) # Quiz2 ### Vragen
1. Hoe oud is Github? 2. Wie heeft de eerste versie van GitHub bedacht/geschreven? 3. Waar staat Git voor? 4. Van wie is GitHub, wie is de eigenaar? 5. In welke taal is GitHub geschreven? 6. Hoe ziet de mascotte van GitHub eruit? 7. Wat is het populairste project op GitHub? 8. Wat is het verschil tussen Git en GitHub?
# Video In deze video wordt uitgelegd hoe je een ERD opstelt. De opdracht die wordt uitgelegd is: Je kunt ook deze link gebruiken: [https://youtu.be/\_q\_lvnJ9enw](https://youtu.be/_q_lvnJ9enw) De opgave die bij deze video hoort:
De planner van het schoolrooster wil een planning maken. In de planning moet komen te staan welke klas wanneer welk vak heeft. De volgende functionaliteiten moet het datamodel ondersteunen. - als planner wil je een klas inplannen op een bepaalde tijd van de week voor een bepaald vak. - als planner wil je de mogelijkheid hebben om elke week het rooster te kunnen aanpassen - als leerling kan ik zien bij wie ik in de klas zit - als leerling kan de planning zien, wanneer heb ik welk vak - de planner wil van elk vak de naam, de afkorting en naam van de vakgroepcoördinator vastleggen - elk vak heeft precies één vakgroepcoördinator - van de leerling wil ik de naam (voor- en achternaam) en geboortedatum kunnen vastleggen - van een klas wil ik de naam, afkorting en startjaar kunnen vastleggen
# Quiz3 ### Front End Basic Bespreek en beantwoord de volgende vragen. Je kunt google gebruiken. Probeer in één of twee zinnen een antwoord te formuleren. 1. Waarvoor gebruikt je HTML? 2. Waarvoor gebruik je CSS? 3. Waarvoor gebruik je JavaScript? 4. Wat is het verschil tussen JavaScript en Java? 5. Wat is front-end? 6. Wat is back-end? 7. Geef van alle technieken weer of het op de front-end of back-end wordt gebruik
TechniekFront-EndBack-End
HTMLJa/NeeJa/Nee
CSSJa/NeeJa/Nee
JavScriptJa/NeeJa/Nee
JavaJa/NeeJa/Nee
PHPJa/NeeJa/Nee
C#Ja/NeeJa/Nee
SQL (Database)Ja/NeeJa/Nee
8. Je wilt een zeer eenvoudige (‘quick and dirty’) website, welke techniek(en) gebruik je? 9. Je wilt één web pagina met een zeer specifieke en mooie vormgeving, welke techniek(en) gebruik je? 10. Je wilt een web site bouwen voor school waarbij ze het lesrooster kunnen bijhouden en waarbij studenten via internet hun rooster kunnen raadplegen. Welke techniek(en) gebruik je? # les ## les.roc.ovh We gaan nog een keer kijken naar het ERD ([opgave 5](https://www.roc.ovh/link/344#bkmrk-voorbeeld-gebruik-lu)). Maak de vragen: [http://www.maxdata.ovh/default/download/Vragen\_ERD.pdf](http://www.maxdata.ovh/default/download/Vragen_ERD.pdf "ERD Vragen") Schrijf de antwoorden op! Als iedereen de antwoorden heeft opgeschreven worden ze besproken. # What is Programming? #### [Podcast](https://eu2.contabostorage.com/2bd05ca4bdf84de7abb8e63f8da25893:share/Deep%20dive%20into%20World%20of%20Programming.mp3) (created with NotebookLM) ### What is Programming? Programming is like giving instructions to a computer to make it do what you want. Imagine you have a robot helper, and you need to tell it step-by-step how to complete a task, like building a LEGO set or solving a puzzle. Programmers write these instructions using special languages that computers understand. By programming, you can create games, apps, websites, and much more! ### Skills You Need to Become a Good Programmer 1. **Focus and Concentration** - **Why It’s Important:** Writing code requires attention to detail. A small mistake, like a missing comma, can cause your program to not work. - **How to Improve:** Practice coding regularly and try to minimize distractions when you work. 2. **Precision and Accuracy** - **Why It’s Important:** Computers follow instructions exactly as you write them. Being precise ensures your program does what you intend. - **How to Improve:** Double-check your code and test it frequently to catch and fix errors. 3. **Patience and Tolerance** - **Why It’s Important:** Sometimes, your code won’t work right away. Bugs and errors are normal parts of programming. - **How to Improve:** Stay calm when things go wrong and take breaks if you feel frustrated. Persistence pays off! 4. **Teamwork** - **Why It’s Important:** Many programming projects are too big for one person. Working well with others helps you build better software. - **How to Improve:** Communicate clearly with your team, share ideas, and be open to others’ suggestions. 5. **Presentation Skills** - **Why It’s Important:** You need to explain your ideas and showcase your work to others, whether it’s classmates, teachers, or future employers. - **How to Improve:** Practice explaining your projects and get comfortable with showing your work to others. 6. **Planning and Organization** - **Why It’s Important:** Breaking down a big project into smaller, manageable tasks helps you stay on track and meet deadlines. - **How to Improve:** Use tools like to-do lists or project management apps to organize your tasks and set goals. ### Loving Puzzles and Being Curious - **Puzzle-Solving:** If you enjoy solving puzzles, programming will feel like a fun challenge. Each problem you solve makes your program better and more efficient. - **Curiosity:** Being curious drives you to learn new things, explore different ways to solve problems, and stay updated with the latest technology trends. ### The Influence of AI on Programming Jobs Artificial Intelligence (AI) is changing the way programmers work, but it’s not replacing them. Here’s how AI is influencing programming: 1. **Automation of Repetitive Tasks** - **What It Means:** AI can handle routine coding tasks, like writing boilerplate code or testing, which saves time. - **Your Advantage:** You can focus on more creative and complex parts of programming, making your work more interesting and impactful. 2. **Enhanced Tools and Assistance** - **What It Means:** AI-powered tools can help you write better code by suggesting improvements, finding bugs, and optimizing performance. - **Your Advantage:** These tools can make you more efficient and help you learn new programming techniques faster. 3. **New Opportunities** - **What It Means:** As AI technology grows, there are more opportunities to work on innovative projects, such as developing smart applications, creating AI models, and improving machine learning systems. - **Your Advantage:** Learning about AI and how to integrate it into your projects can open up exciting career paths. 4. **Continuous Learning** - **What It Means:** The field of AI is always evolving, so programmers need to keep learning new skills and staying updated with the latest advancements. - **Your Advantage:** Embracing lifelong learning will keep you adaptable and valuable in the tech industry. ### In Summary Programming is a creative and exciting field where you get to build things with code. To become a good programmer, you need to be focused, precise, patient, and able to work well with others. Loving to solve puzzles and being curious will help you enjoy and excel in programming. Additionally, understanding and leveraging AI can enhance your skills and open up new opportunities in your programming career. With dedication and the right mindset, you can become a successful and innovative programmer! ## Programming Essentials: A Study Guide ### Short Answer Questions **Answer the following questions in 2-3 sentences.**
1. Why are focus and concentration vital skills for a programmer? 2. How does the principle of precision in programming differ from its application in other fields? 3. Explain how patience and tolerance contribute to a programmer's success. 4. What are the benefits of effective teamwork in a programming context? 5. Why are presentation skills important for programmers, even if they possess exceptional technical skills? 6. How can a programmer benefit from incorporating planning and organization into their workflow? 7. What makes puzzle-solving an advantageous trait for aspiring programmers? 8. Why is curiosity considered a valuable asset in the field of programming? 9. How is Artificial Intelligence (AI) automating repetitive tasks within the programming domain? 10. Describe how AI is creating "New Opportunities" for programmers.
### Short Answer Key
1. Focus and concentration are crucial for programmers because even small errors in code, like a missing comma, can prevent a program from functioning correctly. This meticulousness ensures accurate implementation of instructions. 2. Precision in programming demands absolute accuracy as computers interpret instructions literally. Unlike in other fields where approximations might suffice, programming requires exact syntax and logic for the desired outcome. 3. Patience and tolerance are essential for programmers as debugging and resolving errors are integral parts of the process. Remaining calm and persistent when facing challenges allows for effective problem-solving. 4. Teamwork in programming allows for diverse perspectives and skillsets to converge, resulting in more robust and innovative software solutions. Collaboration facilitates efficient division of labour and effective troubleshooting. 5. Presentation skills are vital for programmers as they need to effectively communicate their ideas, solutions, and the value of their work to both technical and non-technical audiences. This includes clearly articulating complex concepts and design choices. 6. Planning and organization help programmers break down complex projects into smaller, manageable tasks. This systematic approach ensures projects stay on track, deadlines are met, and code remains well-structured and maintainable. 7. Puzzle-solving aligns with programming as it involves breaking down problems into smaller components, analyzing patterns, and applying logical reasoning to find solutions – all essential skills for effective coding. 8. Curiosity encourages programmers to explore new technologies, delve into unfamiliar programming concepts, and continuously seek innovative solutions. This constant learning and adaptation are crucial in the ever-evolving tech landscape. 9. AI is automating repetitive programming tasks such as generating boilerplate code, conducting basic testing, and identifying potential code vulnerabilities. This automation frees up programmers to focus on more complex and creative aspects of development. 10. AI is creating new opportunities for programmers by driving demand for professionals skilled in AI development, machine learning integration, and intelligent application design. This expansion of the field offers programmers exciting and specialized career paths.
### Essay Questions
1. Discuss the importance of lifelong learning in the context of a programming career, emphasizing how evolving technologies and industry trends impact a programmer's relevance and success. 2. Analyze the evolving relationship between artificial intelligence and programming. Explore both the concerns and opportunities AI presents for aspiring programmers. 3. Explain how the combination of hard skills, such as proficiency in specific programming languages, and soft skills, such as communication and problem-solving, contributes to a well-rounded programming professional. 4. Evaluate the significance of both individual focus and collaborative teamwork in programming projects. When are each of these approaches most effective, and how can a balance between them be achieved? 5. Choose one programming language and discuss its key features, advantages, and limitations. Provide specific examples of the types of applications for which this language is well-suited.