Programozási ismeretek oktatása: kód vagy algoritmus

Az előadások a következő témára: "Programozási ismeretek oktatása: kód vagy algoritmus"— Előadás másolata:

1 Programozási ismeretek oktatása: kód vagy algoritmus
Menyhárt László, Dr. Pap Gáborné IV. Oktatás-Informatikai Konferencia Budapest,

2 Bevezetés Miről lesz szó? Miért kezdődött el a munka? Mi lett belőle?
Hogyan lehet használni? Mivel lehet folytatni?

3 Alapok ELTE-IK-n Programozási Alapismeretek oktatása
Rá kell vennünk a hallgatókat a módszeres gondolkodásra Algoritmust először Kell egy programozási nyelv is Kódot másodszor Megvalósítás, kipróbálás Most C++-t használunk

4 Alapok Tehát kell mindkettő Miért? Hogyan? Algoritmus Kód Általánosabb
Módszeres feladatmegoldás Kód Speciális nyelvi kifejezések Futtatás miatt szükséges

5 Módszeres feladatmegoldás
Feladat megértése / specifikálás Adatmodell (be/kimenet, elő/utófeltétel) Algoritmus készítés (nyelvfüggetlen) Implementálás Code::Blocks IDE, C++ nyelv Futtatás, hibakeresés/javítás Tesztelés Dokumentálás (csak házi feladatban)

6 Tapasztalatok Specifikáció hiányos (ha van) Nekiesnek a kódnak
Algoritmus a kódból visszafejtve ReplaceAll (informatikus -> inciklusmatikus) Tesztelés összecsapott Dokumentáció <- mintadokumentációból a végén benne maradnak részek a mintából (pl specifikáció)

7 Ötlet Adjunk egy alkalmazást, ami segít Adatot gyűjteni
Dupla munka kiküszöbölése Dokumentáció, kód előgenerálás (időt spórolunk a diáknak copy-paste helyett) Win-win helyzet kialakítása Mindenki nyerjen Mert az erőszak nem használ

8 Saját készítésű web-es alkalmazás
Programming Fundamentals Wizard - PFW Web-es rendszer (langs: HU, EN) Java-ban fejlesztve (JSP, HTML, CSS, JS, XSLT) Glassfish Application Server-en fut Az egyetemi szerveren Felhasználó azonosítása Gmail (OpenID), inf.elte.hu-s vagy regisztrált név/jelszó párral Az adatok tárolása speciális XML formátumban

9 PFW Adatgyűjtés helye Általános információk (fejlesztés előtt)
Feladat szövege, készítő, … Egy feladat több részfeladatot tartalmazhat Bemenet és előfeltételben lehetnek közös részek Részfeladatonként Kiegészítő bemenet és előfeltétel Kimenet, utófeltétel és algoritmus Kiegészítő információk (kódolás után) Tesztelés, fejlesztési lehetőségek

10 Algoritmus leírók Eljárás összegzés(N, X[], S): S:=0;
ciklus i:=1-től N-ig S:=S+X[i]; ciklus vége Eljárás vége void subtask_1(int N, int X[], int & S){ S:=0; for (int i=0; i<N; i++) { S=S+X[i]; }

11 Algoritmus a PFW-ben NSD (Nassi-Shneiderman Diagram, struktogram)
Komplex diagram Dobozok jelekkel és jelentésekkel Nyelvfüggetlen (programozási és természetes) Külföldi hallgatók képzése angol nyelven Pszeudókód angolul hasonlít a programozási nyelvekhez Anyanyelvüket én nem beszélem Nehéz rajzolni (papíron, hibajavítás, …)

12 Kitekintés - „NSD szerkesztők”
Ben Shneiderman 2003-ban összegyűjtötte StruktoGraaf 3.0 Holland, fizetős, € 84,- EasyCode Német EuroSoftInc kezdte, EasyCode, kód generálás, fizetős (14 nap próba) SmartDraw Amerika Kaliforniai, $ 197,-

13 Kitekintés - „NSD szerkesztők”
Microsoft Visio SourceCoder Már nem elérhető a HREF Tools Corp. Cég honlapja szerint. Még pár (6-10) link nem elérhető

14 Kitekintés - „NSD szerkesztők”
Nem szerepeltek az oldalon Egyéb Microsoft termékek Paint eszközök Javításkor elölről kell újrarajzolni Structorizer Luxemburgi, weben applet, letölthető Stukimania ELTE-s szakdolgozat Webes

15 PFW-ben megoldva Java, JSP, HTML, JS, CSS XML XSLT NSD szerkesztés
Új TML nyelv (task, feladat leírás, AML-re épül) XSLT Generálásokhoz, NSD megjelenítéshez NSD szerkesztés Egér jobb-gomb, Ajax hívás, újratöltés

16 PFW – így néz ki

17 PFW - így néz ki

18 PFW - így néz ki

19 PFW - így néz ki

20 PFW - így néz ki

21 PFW - így néz ki

22 PFW - így néz ki

23 PFW - így néz ki

24 PFW - így néz ki

25 PFW, mint generátor Van sok információnk Lehetséges a generálás
Dokumentációt és algoritmust Nem 100%-os megoldást! Sablont az ismert adatokkal

26 Dokumentáció generálása
Kattintunk egy gombon MS Word dokumentum letöltése HTML doc kiterjesztéssel és mime típussal Betöltődik a programba Lehetne OpenOffice is (más kiterjesztés és mime) Piros színnel jelzi, hogy hol kell belenyúlnia a hallgatónak. „Javítsd!” Képernyő képek, saját kiegészítések, …

27 Generált dokumentáció
NSD

28 Forráskód generálása Kattintás egy gombon
Tömörített (zip) könyvtár letöltése Code::Blocks projekt <rövidnév>.cbp, main.cpp, subtasks.h, subtasks.cpp

29 Generált forráskód NSD

30 Generált forráskód main.cpp
Változók generálása a specifikációból (be-/kimenet) Függvényhívások minden részfeladathoz Adatok beolvasását implementálni kell Klaviatúra vagy fájl Adatok kiírását implementálni kell Képernyő vagy fájl

31 Generált forráskód subtasks.h subtasks.cpp
Minden függvényhez a fejléc információk Paraméterek a specifikációból (be-/kimenet) subtasks.cpp Generált forráskód az algoritmusból A hibás szintaxisú kódot javítani kell! void subtask_1(int N, int X[], int & S){ S:=0; while (i:=1..N) { S:=S+X[i]; }

32 Generált forráskód Lehetséges a nyelvspecifikus kifejezések használata
de inkább NE! Algoritmus maradjon nyelvfüggetlen! void subtask_1(int N, int X[], int & S){ S=0; int i=0; while (i<N){ S=S+X[i]; i++; }

33 Módszertan Szeretnénk ha a hallgatók tartanák a sorrendet:
1. Algoritmus, 2. Forráskód Nincs elég időnk Időt spórolunk a generálással Régi sablonból hibás információk nem maradnak Könnyen szerkeszthető NSD Egységes kinézetű specifikáció és algoritmus Nyelvfüggetlen algoritmus

34 Módszertan Vonalvezetőt adunk a lépések betartásához
Meg tudjuk mutatni a kapcsolatot a specifikáció és forráskód között Meg tudjuk mutatni a kapcsolatot az algoritmus és forráskód között A szintaktika javításával is tanulható a programozási nyelv Elektronikus felületet biztosítunk a gyakorláshoz

35 Módszertan Segítünk, de Nem helyettesítjük a gondolkodást kódolást
dokumentálást

36 Módszertan Módszeres, szisztematikus Élményközpontú és sikerorientált
Folyamat, amit be kell tartani Élményközpontú és sikerorientált gyorsan és látható eredmény kis módosítással futó kód Felfedeztető Specifikáció és függvény paraméterek kapcsolata Algoritmus és kód összehasonlítása

37 A jövő Fejlesztési lehetőségek
MathML beépítése az elő- és utófeltételekhez Házi feladatokhoz Kivonat generálás A4-es PDF Feladat szöveg, specifikáció és algoritmus Fejlesztés megkezdése előtt be lehetne adni küldéssel beadás a rendszerből Automatizált kiértékelés (legalább elő feldolgozás)

38 Irodalom I. Nassi, B. Shneiderman: Flowchart techniques for structured programming, ACM SIGPLAN Notices, Volume 8 Issue 8, August 1973, Pages Dijkstra E.W.: A Discipline of Programming, Prentice-Hall, Englewood Cli_s, 1973. Szlávi Péter, Zsakó László: Módszeres programozás: Programozási bevezető, 18. Mikrológia Sz. Csepregi, A. Dezső, T. Gregorics, S. Sike: Automatic Implementation of Service Required by Components, Workshop on Property Verification for Software Components and Services ,PROVECS 2007,

39 Irodalom Menyhárt László: Can a language be before "the first programming language"?, Teaching Mathematics and Computer Science, 2011, Volume IX, Issue II, ISSN: , Menyhárt László, Pap Gáborné: Dokumentáció alapú programfejlesztés; INFODIDACT 2012 konferencia, Zamárdi, Magyarország, Menyhárt László, Pap Gáborné: How can we get our students to think while we help their work too?: Document based development; Proceedings of the 7th International Multi-Conference on Society, Cybernetics and Informatics. Konferencia helye, ideje: Orlando, Amerikai Egyesült Államok, Florida: International Institute of Informatics and Systemics (IIIS), pp (ISBN:ISBN-13: )

40 Irodalom Vladimir Averbukh, Mikhail Bakhterev: The analysis of visual parallel programming languages, ACSIJ Advances in Computer Science: an International Journal, Vol.2, Issue3, No. 4,2013, ISSN : Martin Weise: A Model for Teaching Informatics to German Secondary School Students in English-language Bilingual Education, Proceedings of the 6th International Conference ISSEP 2013; Oldenburg, Germany, February 26–March 2, 2013/Diethelm et al. (Eds.)/ Potsdam: Universitätsverlag Potsdam, 2013/ S B. Shneiderman: A short history of structured flowcharts (Nassi- Shneiderman Diagrams), University Maryland, 2003, Bob Fisch: Structorizer, Molnár Tamás: StukiMania,

41 Irodalom https://157.181.166.134:8181/PFW/index2_HU.jsp
zImWkTFnI4HmA/viewform ERsTi1rS1V6OGc3Rzc3cm85YW5KNFE6MA#gid=0

42 Köszönjük a figyelmet! Elérhetőség
Menyhárt László Gábor Dr. Pap Gáborné Tel.: / 8652 , 8469 Fax: Cím: Budapest, Pázmány Péter sétány 1/C