VisualStudio Pikaopas, osa 1: WEB sivujen suunnittelu



Samankaltaiset tiedostot
VisualStudio Pikaopas, osa 1: WEB-sivujen suunnittelu

Microsoft Visual Studio 2005

Haaga-Helia/IltaTiko ict2tcd005: Ohjelmiston suunnittelutaito 1/7 Anne Benson. Tällä opintojaksolla käytämme VS:n kolmen kokonaisuuden luomiseen:

Eclipse 3.2 pikku opas versio 1.0. Esittely Uuden projektin perustaminen Sovelluksen luominen Koodin siistiminen Vinkkejä


Verkkosivut perinteisesti. Tanja Välisalo

Vahva tunnistautuminen Office palveluihin. MFA Suojauksen lisätarkistus

F-Secure KEY salasanojenhallintaohjelman käyttöönotto PC -laitteella

Paavo Räisänen. WampServer palvelimen asennus ja käyttö Eclipsen kanssa, sekä ensimmäinen FTP yhteys.

OHJE Jos Kelaimeen kirjautuminen ei onnistu Windows-koneilla

Tietosuoja-portaali. päivittäjän ohje

Webinaariin liittyminen Skype for

Eclipse 3.1 Pikaopas versio 1.0

Web Services tietokantaohjelmoinnin perusteet

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012

OHJE Jos Kelaimeen kirjautuminen ei onnistu Mac-koneella Sisällys

KESKUSTANUORTEN NETTISIVUT- OHJEITA PIIRIYLLÄPITÄJÄLLE 1. KIRJAUTUMINEN

Pedacode Pikaopas. Web-sovelluksen luominen

Outlook ja Yritysportaali Androidille

Skype for Business ohjelman asennus- ja käyttöohje Sisällys

Tilastokeskuksen rajapintapalveluiden käyttöönotto QGIS-ohjelmistossa

Joomla pikaopas. Yksinkertainen opas, jossa neuvotaan esimerkkisivuston teko Joomla julkaisujärjestelmällä vaihe vaiheelta.

Gree Smart -sovelluksen (WiFi) asennus- ja käyttöohje: Hansol-sarjan ilmalämpöpumput WiFi-ominaisuuksilla

Outlook ja Yritysportaali iphonelle

,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU

CLOUDBACKUP TSM varmistusohjelmiston asennus

Internet Explorer 7 & 8 pop-up asetukset

Windows 8.1 -käyttöjärjestelmän käytön aloitus

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2013

Taulukot Päivi Vartiainen 1

Office ohjelmiston asennusohje

- Kuvan osoittamalla tavalla klikkaa kohtaa Tallenna Tiedosto. - Esimerkissämme Firefox selaimessa latauspalkki näyttää tältä

Secure hubiin kirjautuminen

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012

Viva-16. Käyttöohje Veikko Nokkala Suomen Videovalvonta.com

Ohje olettaa, että Java on asennettu oletuskansioonsa sekä päivitetty uusimpaan versioonsa ja että selaimen latauskansiona on oletus.

Verkkojulkaiseminen Minna Väisänen. HTML5-tehtävä

Henkilö- ja koulutusrekisterin asennusohje

Outlook ja Yritysportaali Androidille

Visma Liikkuvan työn ratkaisut Päivitysohje. Pääkäyttäjän opas

Skype for Business ohjelman asennus- ja käyttöohje Sisällys

Java Runtime -ohjelmiston asentaminen

Ubuntu - peruskäyttö. Seuraavassa läpikäydään Ubuntun peruskäyttöä:

Skhole Käyttöohjeet Pääkäyttäjille ja Ohjaajille. Päivitetty

Skype for Business pikaohje

Visma Liikkuvan työn ratkaisut

Google-dokumentit. Opetusteknologiakeskus Mediamylly

JAKELUPISTE KÄYTTÖOHJE 2/6

NUUO ETÄOHJELMA PIKAOPAS. Maahantuoja Dasys Oy Kaivolahdenkatu HELSINKI helpdesk@dasys.fi

KTJkii-rekisterinpitosovelluksen ohje tiedostojen siirto työaseman ja palvelimen välillä

Wordpress- ohje nettisivujen laadintaan

Pedacode Pikaopas. Web Service asiakasohjelman luominen

erasmartcardkortinlukijaohjelmiston

F-Secure KEY salasanojenhallintaohjelman käyttöönotto Mac -laitteella

Tekstieditorin käyttö ja kuvien käsittely

AutoFutur / KoneFutur verkkojärjestelmän päivitysohje

C# Windows ohjelmointi perusopas

E-kirjan lainaaminen ja lukeminen

Windows 10 -käyttöohje

SSH Secure Shell & SSH File Transfer

HAMINETTI WLAN LIITTYMÄN KÄYTTÖÖNOTTO-OHJE

jos haluatte säilyttää ja jatkaa vanhan OneNote-muistion sisällön kanssa.

Raporttiarkiston (RATKI) käyttöohjeet Ohjeet

FOTONETTI BOOK CREATOR

Outlook ja vahva tunnistautuminen iphonelle

Sanomapavelinohjelmiston käyttöohje (Vanha versio RO)

2. PPPoE YHTEYDEN POISTAMINEN BAANA-CLIENT Windows 2000 / XP

Secure hubiin kirjautuminen

FrontPage Näkymät

Webmailin käyttöohje. Ohjeen sisältö. Sähköpostin peruskäyttö. Lomavastaajan asettaminen sähköpostiin. Sähköpostin salasanan vaihtaminen

Outlookin konfigurointi. Huoltamosähköposti Sonerahosted

Outlook ja vahva tunnistautuminen Android-laitteelle

Posterin teko MS Publisherilla

CMS Made Simple Perusteet

WINDOWS 8.1. SAMPOLAN KIRJASTO TIETOTORI Sammonkatu Tampere tietotori.sampola@tampere.fi

Käyttöohjeet. Sovellussivusto

TIETOKONEEN ASETUKSILLA PARANNAT KÄYTETTÄVYYTTÄ

Kahoot! Kirjautuminen palveluun. Sinikka Leivonen

Karttapalvelun käyttöohjeet

KTJkii-rekisterinpitosovellus ja Kunta tiedostosiirto

Tikon Ostolaskujenkäsittely/Web-myyntilaskutus versio 6.3.0

WINDOWS 10 -kurssi.

TTY TKT-1110 Mikroprosessorit TKT. HEW-ohjeet ver 1.0

Tikon Web-sovellukset

Muistitikun liittäminen tietokoneeseen

Ohjelmistopohjaisen lisenssin käyttö

Tikon Ostolaskujenkäsittely/Web-myyntilaskutus versio 6.4.0

PIKAOPAS NOKIA PC SUITE 4.51a NOKIA PUHELIMELLE

BaseMidlet. KÄYTTÖOHJE v. 1.00

Visma Nova. Visma Nova ASP käyttö ja ohjeet

Navigator 6.0 Uuden käyttöliittymän pika-aloitusopas

ClassPad fx-cp400 päivitys. + Manager for ClassPad II Subscription päivitys

ILMAINEN KARTTATIETO

PRINTER DRIVER PÄÄKÄYTTÄJÄN OPAS

Olet tehnyt hyvän valinnan hankkiessasi kotimaisen StorageIT varmuuskopiointipalvelun.

JOVISION IP-KAMERA Käyttöohje

5. Klikkaa avautuvan ikkunan oikeasta yläkulmasta käyttäjätunnustasi ja valitse Luo pikakuvake

Diakonia-ammattikorkeakoulu SoleOps Opiskelijan opas. SoleOps

Suvi Junes/Pauliina Munter Tietohallinto / Opetusteknologiapalvelut 2014

ETÄPALVELU. HALTIK Videoportaali - osallistujan ohje

Transkriptio:

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 1 VisualStudio Pikaopas, osa 1: WEB sivujen suunnittelu Tämä pikaopas opastaa käyttämään VisualStudion web sivujen suunnittelu ja toteutusominaisuuksia. 1. Valitse File New Web Site. Projektivalinta antaa työasemapohjaisten sovellusten valikot. 2. Voit valita, mitä ryhdyt toteuttamaan. Valitse Empty Web Site. HUOMAA myös Location ja Language, ne täytyy valita asianmukaisiksi. Poikkeuksellisesti talletetaan kaikki dokumentaatio C levylle, omaan käyttäjähakemistoon. VS ei pysty ajamaan sovellusta myyltä verkon yli.

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 2

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 3 3. Eteesi aukeaa työskentelynäkymä: Oikeassa ruudussa näkyvät sovelluksen muodostavat komponentit. Niitä ei vielä ole tehty. Lisätään ensimmäinen komponentti, XHTML sivu. Voit tehdä sen joko: File New File valikkovalinnan tai klikkaamalla hiiren oikeata näppäintä WebSite4:n kohdalla, jolloin valitse Add new Item Lopputulos on sama. Näet kohdevalintaikkunan: Valitse HtmlPage. Voit tässä nimetä sivun, esimerkiksi Pyorasuunnitelma.htm

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 4 4. Valitse Design näkymä: Vasemmassa reunassa näet kaikki gui komponentit, joita voit html sivulla käyttää. Vaihtoehto: Jos haluat lähteä toteuttamaan pyöräsuunnitelma sivua Fillariverstas websovellusta varten, kannattaa valita suunnitelmasivuksi (kohta 3) Web Form. Tämä valinta luo sovellukseen.asp sivupohjan (Active Server Page) jotka ovat Fillariverstassovelluksen sivupohjia. Web sovelluksen rakenne voi olla esimerkiksi: Aloitussivu, joko.asp tai.html tyypinen Sisältösivu1, yleensä.asp Sisältösivu2, yleensä.asp SisältösivuN, yleensä.asp Sivun toiminnallinen toteutus, C# komponentti Sivun toiminnallinen toteutus, C# komponentti Sivun toiminnallinen toteutus, C# komponentti.asp sivun voit toteuttaa samalla tavalla design tilassa kuin html sivun. Molemmissa tapauksissa joudut lisäämään myös omaa koodiasi sivustoon, esimerkiksi rivinvaihto täytyy toteuttaa tagilla (merkinnällä).

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 5 Kun lisää komponentteja sovellukseesi, näet ne oikeanpuoleisessa ikkunassa: 5. Sivujen testaaminen Voit pikatestata sivun näkyvyyden Debug painikkeella: Sovellus kysyy: Tässä vaiheessa voit valita Run without debugging. Tällöin sivujasi ei validoida, eli niissä voi olla virheitä ja lopputulos selaimessa yllättää. Tavallisesti rakennamme ensin sovelluksen (Build valikko) ja sen jälkeen ajetaan sivusto.

HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 6 Sovelluksen ajaminen käynnistää paikallisen web palvelimen. Löydät kuvakkeen informaatioriviltä oikeasta alalaidasta: 6. Vinkkejä Visual Studion käyttöön opintojaksollamme Voit opiskella XML:ää, XHTML:ää ja ASP teknologiaa : Erinomainen perustaitojen sivusto: www.w3schools.com Microsoftin ASP Tutorial http://msdn.microsoft.com/en us/library/ms972337.aspx Lopuksi ÄLKÄÄ ryhtykö vielä toteuttamaan sivustoa täystehoisesti. Nyt voitte miettiä sommittelua, komponentteja, millaisia navigointimahdollisuuksia käyttäjälle tarjotaan jne. Jotta sivuston toteutus sujuu jouheasti ja lopputulos toimii käyttäjän näkökulmasta hyvin, tulemme opiskelemaan vielä ylemmän tason, koko sovelluksen ulkoasuun ja toiminnallisuuteen vaikuttavia piirteitä, mm. CSS:ää ja MasterPage tekniikkaa.