Web前端實習(xí)報告

1、本文檔如對你有幫助，請幫忙下載支持！實習(xí)報告學(xué)生姓名：學(xué)號：專業(yè)班級：實習(xí)單位：實習(xí)時間：校外指導(dǎo)教師：校內(nèi)指導(dǎo)教師：成績：本文檔如對你有幫助，請幫忙下載支持！目 錄1 實習(xí)背景 .錯誤 ! 未定義書簽。1.1實習(xí)目的 .錯誤 ! 未定義書簽。1.2實習(xí)起止時間. 錯誤 ! 未定義書簽。1.3實習(xí)內(nèi)容概要. 錯誤 ! 未定義書簽。2實習(xí)內(nèi)容 . .錯誤 ! 未定義書簽。2.1實習(xí)過程 .錯誤 ! 未定義書簽。2.2實習(xí)內(nèi)容. 錯誤 ! 未定義書簽。2.3主要成果. 錯誤 ! 未定義書簽。3總結(jié) .錯誤 ! 未定義書簽。3.1網(wǎng)頁游戲的認(rèn)識. 錯誤 ! 未定義書簽。3.2實習(xí)的自我評價. 錯誤

2、! 未定義書簽。本文檔如對你有幫助，請幫忙下載支持！1 實習(xí)背景1.1 實習(xí)目的? 了解軟件開發(fā)的各種模式，開發(fā)流程，以及各種形式的建模? 詳細(xì)學(xué)習(xí)敏捷開發(fā)的各個流程，并通過實習(xí)來體會敏捷開發(fā)所帶來的效率? 掌握 HTML5 、 CSS、JAVASCRIPT 等技術(shù)1.2 實習(xí)起止時間? 開始時間： 2015 年 7 月 12 號? 截止時間： 2015 年 7 月 18 號1.3 實習(xí)內(nèi)容概要? 學(xué)習(xí)軟件開發(fā)的各種模式，重點學(xué)習(xí)了敏捷開發(fā)（專業(yè)老師講授）? 學(xué)習(xí) HTML5、 CSS、 JAVASCRIP技術(shù)（形式：觀看視頻）? 按照敏捷開發(fā)的流程，學(xué)員分組，制定每日的站立會議時間? 觀看實

3、習(xí)內(nèi)容例子的視頻，分工合作? 提交實習(xí)成果，老師檢查打分2 實習(xí)內(nèi)容2.1實習(xí)過程可以以周為時間單位概述實習(xí)各階段所從事的主要工作等；? 學(xué)習(xí)階段開發(fā)模式本文檔如對你有幫助，請幫忙下載支持！1) 軟件生命周期同任何事物一樣, 一個軟件產(chǎn)品或軟件系統(tǒng)也要經(jīng)歷孕育、誕生、成長、成熟、- 衰亡等階段，這一般稱為軟件生命周期。軟件開發(fā)生命周期(SDLC)是指軟件開發(fā)的全部過程、活動和任務(wù)的結(jié)構(gòu)框架。SDLC的一般步驟包括：確定問題、可行性分析與開發(fā)計劃、收集需求、分析與設(shè)計、編碼開發(fā)、測試、安裝、維護。2) 軟件生命周期模式典型的幾種生命周期模式包括：瀑布模式、演化模式、螺旋模式、快速原型模式、噴泉模

4、式和混合模式等。3) 敏捷開發(fā)敏捷開發(fā)（ Agile ）是一種關(guān)注價值、消除浪費、以人為核心、迭代、循序漸進的開發(fā)方法。特點：a)是一種開發(fā)方法學(xué)（Methodology ），可以應(yīng)對客戶快速變更的需求。b) 強調(diào)以人為核心，采用迭代的方式，循序漸進地開發(fā)軟件。c) 在敏捷開發(fā)過程中，軟件項目被劃分成多個相互聯(lián)系但也能獨立運行的子項目。d) 每個子項目在開發(fā)、測試直至完成的過程中一直保持可使用的狀態(tài)。e) 這個過程就是要形成開發(fā)過程中團隊之成員之間更加有效的合作關(guān)系，使其靈活性更高，以適應(yīng)不斷變化的需求。技術(shù)講解1)講解內(nèi)容： HTML5 、 CSS、 JAVASCRIPT 技術(shù)2)HTML5

5、HTML5 是一個描述用于幫助開發(fā)者創(chuàng)建下一代網(wǎng)站和應(yīng)用的HTML 、 CSS 和JavaScript 規(guī)格的涵蓋性術(shù)語。這個定義中最顯眼的三個部分是：HTML 、 CSS 和JavaScript。他們定義了開發(fā)者如何使用優(yōu)化標(biāo)記，風(fēng)格更豐富的性能， 以及新 JavaScriptAPI 來制作最新的網(wǎng)絡(luò)開發(fā)功能。簡單而言，HTML5=HTML+CSS+JavaScript 。特性：本文檔如對你有幫助，請幫忙下載支持！a) 語義特性（ Class： Semantic）b) 本地存儲特性（ Class: OFFLINE & STORAGE ）c) 設(shè)備兼容特性 (Class: DEVICE ACC

6、ESS)d) 連接特性（ Class: CONNECTIVITY ）e) 網(wǎng)頁多媒體特性 (Class: MULTIMEDIA)f) 三維、圖形及特效特性（ Class: 3D, Graphics & Effects ）g) 性能與集成特性（ Class: Performance & Integration ）h) CSS3 特性 (Class: CSS3)3) CSSCSS(層疊樣式表 )是一種用來表現(xiàn)HTML（標(biāo)準(zhǔn)通用標(biāo)記語言的一個應(yīng)用）或 XML（標(biāo)準(zhǔn)通用標(biāo)記語言的一個子集）等文件樣式的計算機語言。CSS 使用方法：a) 外聯(lián)式 Linking （也叫外部樣式） ：將網(wǎng)頁鏈接到外部樣式表

7、。b) 嵌入式 Embedding （也叫內(nèi)頁樣式） ：在網(wǎng)頁上創(chuàng)建嵌入的樣式表。c) 內(nèi)聯(lián)式 Inline （也叫行內(nèi)樣式） ：應(yīng)用內(nèi)嵌樣式到各個網(wǎng)頁元素。CSS 布局特點：a) 精簡代碼，降低重構(gòu)難度b) 網(wǎng)頁訪問速度c) SEO優(yōu)化d) 瀏覽器兼容性基礎(chǔ)語法：a) CSS 規(guī)則由兩個主要的部分構(gòu)成：選擇器，以及一條或多條聲明。b)選擇器 宣言1;宣言2; .宣言N c)選擇器通常是您需要改變樣式的HTML 元素。d) 每條聲明由一個屬性和一個值組成。e)屬性（ property）是您希望設(shè)置的樣式屬性（style attribute）。每個屬性有一個值。屬性和值被冒號分開。f)選擇器 p

8、roperty: value本文檔如對你有幫助，請幫忙下載支持！4) JAVASCRIPTJavaScript一種直譯式腳本語言，是一種動態(tài)類型、弱類型、基于原型的語言，內(nèi)置支持類型。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用于客戶端的腳本語言，最早是在HTML（標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用）網(wǎng)頁上使用，用來給 HTML網(wǎng)頁增加動態(tài)功能。組成a) ECMAScript ，描述了該語言的語法和基本對象。b) 文檔對象模型（ DOM），描述處理網(wǎng)頁內(nèi)容的方法和接口。c) 瀏覽器對象模型（ BOM），描述與瀏覽器進行交互的方法和接口。特點a)是一種解釋性腳本語言（代碼不進行預(yù)

9、編譯）。b) 主要用來向 HTML（標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用）頁面添加交互行為。c) 可以直接嵌入 HTML頁面，但寫成單獨的 js 文件有利于結(jié)構(gòu)和行為的分離。d) 跨平臺特性，在絕大多數(shù)瀏覽器的支持下，可以在多種平臺下運行（如Windows、 Linux 、 Mac、 Android 、iOS 等）。? 開發(fā)階段開發(fā)第一天站立會議： 8.00 8.15會議內(nèi)容：小組分工，制定站立會議時間，了解每個人的學(xué)習(xí)情況，交流學(xué)習(xí)的內(nèi)容任務(wù)內(nèi)容：“打地鼠”網(wǎng)頁游戲的網(wǎng)頁布局HTML5+CSS技術(shù)開發(fā)第二天站立會議： 8.00 8.15會議內(nèi)容：小組分工，完成情況，了解每個人的進度，交流學(xué)習(xí)的內(nèi)容任

10、務(wù)內(nèi)容：“打地鼠”網(wǎng)頁游戲的功能實現(xiàn)開發(fā)第三天站立會議： 8.00 8.15會議內(nèi)容：小組分工，完成情況，查漏補缺，測試軟件，尋找bug，交流學(xué)習(xí)的內(nèi)容任務(wù)內(nèi)容：“打地鼠”網(wǎng)頁游戲的軟件測試，尋找不足，確認(rèn)無誤，提交實習(xí)結(jié)果本文檔如對你有幫助，請幫忙下載支持！2.2實習(xí)內(nèi)容? 項目介紹“打地鼠”網(wǎng)頁游戲是安卓版“打地鼠”游戲的進一步開發(fā)，可以實現(xiàn)在網(wǎng)頁中構(gòu)建游戲的所有功能，并且不用下載安裝既可以用的游戲，網(wǎng)頁版游戲的市場前景潛力無限，國內(nèi)逐漸發(fā)展起來一批喜歡網(wǎng)頁游戲的用戶群，并且網(wǎng)頁游戲?qū)儆谥行⌒偷捻椖?，易于開發(fā)，應(yīng)用于敏捷開發(fā)的流程，效率十分高。? 我的任務(wù)“打地鼠”網(wǎng)頁游戲網(wǎng)頁布局的調(diào)整，

11、以及“打地鼠”之所謂“打”的動畫實現(xiàn)，還有最后的“軟件測試” 。? 軟硬件平臺DREAMWEA VER CS 6， M OZILLAFIREFOX 瀏覽器， PHOTOSHOP CS 6? 使用技術(shù)HTML5CSSJAVASCRIPT瀏覽器中的開發(fā)人員調(diào)試PHOTOSHOP CS 6 的圖片處理技術(shù)JAVASCRIPT 的進階 JQERY 技術(shù)2.3主要成果“打地鼠”網(wǎng)頁游戲的成功開發(fā)，基本功能：打地鼠的動畫，游戲的時間限制，統(tǒng)計分?jǐn)?shù)，開始游戲，暫停游戲，結(jié)束游戲，走馬燈介紹等等。但是在實際測試的時候仍然出現(xiàn)了一些BUG ，比如動畫的遲緩（主要是因為動畫的緩沖沒有做好），還有一些分?jǐn)?shù)的統(tǒng)計不甚

12、合理，這在我們應(yīng)用的時候及時的發(fā)現(xiàn)，并且處理了這樣的問題。本文檔如對你有幫助，請幫忙下載支持！3總結(jié)3.1網(wǎng)頁游戲的認(rèn)識網(wǎng)頁游戲又稱Web 游戲，無端網(wǎng)游，簡稱頁游。是基于Web 瀏覽器的網(wǎng)絡(luò)在線多人互動游戲，無需下載客戶端，不存在機器配置不夠的問題，最重要的是關(guān)閉或者切換極其方便，尤其適合上班族。在那個網(wǎng)絡(luò)泡沫經(jīng)濟高速擴張的年代，在那個大量菜鳥網(wǎng)民擁入網(wǎng)絡(luò)的年代，在那個文字MUD 已經(jīng)逐漸衰退而網(wǎng)絡(luò)游戲又尚未興起的年代，這種新穎玩意兒的推出，無疑讓很多人為之驚艷。僅僅通過簡單注冊，就可以邊玩游戲邊泡論壇。盡管只有簡陋的游戲界面、一堆文字、幾張圖片，游戲方式也不過是刷新頁面而已，但WebGam

13、e 卻帶來了無限的樂趣和遐想，同時還演繹了讓無數(shù)人刻骨銘心的愛恨情仇。如今網(wǎng)絡(luò)游戲百花爭鳴，到處充斥著唯美的人物和絢麗的光影。你會偶爾緬懷那些逝去的歲月嗎？至少在我心底，一直有數(shù)款難以忘懷的WebGame。WebGame，顧名思義就是基于Web 瀏覽器的網(wǎng)絡(luò)在線多人游戲。從誕生發(fā)展至今，WebGame 大概分為三種類型：一是基于Web 瀏覽器，使用PHP/ASP/Perl 等解釋語言建設(shè)的虛擬社區(qū)；二是基于Web瀏覽器，使用Flash/JAVA 技術(shù)制作的游戲；三是需要下載客戶端并連接專用服務(wù)器運行的游戲。網(wǎng)頁游戲盡管EBS 將國內(nèi) WebGame 的發(fā)展往前推了一把，但是一段時間后，這類We

14、bGame 的弱點逐漸暴露出來。一些架設(shè)WebGame 供網(wǎng)民免費游玩的站點，由于質(zhì)量和管理不過關(guān)、服務(wù)器負(fù)載過大，丟失了不少玩家。同時，比WebGame 華麗 N 倍的網(wǎng)絡(luò)游戲興起后，WebGame 自然就逐漸沒落了。傳統(tǒng)意義上的WebGame 依然為少部分熱愛者延續(xù)至今，而且游戲性與游戲素材比以前豐富許多。? 前景分析網(wǎng)頁游戲的市場潛力巨大，與其他類型網(wǎng)游相比有著強勁優(yōu)勢網(wǎng)頁游戲的用戶群逐漸培養(yǎng)起來，極有可能成為未來網(wǎng)游用戶的一支主力軍避大型網(wǎng)游之鋒芒，堅持走游擊路線。堅持和中小站長合作針對用戶群大膽創(chuàng)新，敢于突破固有模式? 游戲特點混搭式類型成主流策略游戲不斷豐富本文檔如對你有幫助，請幫忙下載支持！游戲內(nèi)容多樣化消費群體不斷成熟市場集中度提高游戲跨形態(tài)融合產(chǎn)品結(jié)構(gòu)漸豐富步入全球化運作企業(yè)品牌意識增強3.2實習(xí)的自我評價這次實訓(xùn)充分利用了課堂所學(xué)，掌握了許多關(guān)鍵技術(shù)，例如模版技術(shù)，CSS 樣式，使得制作過程方便了很多。在完成基本要求得基礎(chǔ)上，文件夾、文件命名規(guī)范；文件存放位置合理；制作完成之后進行過現(xiàn)場清理：沒有無用的文件、文件夾，沒有斷鏈(外部鏈接不算)；工作量飽滿：內(nèi)容較豐富、自己設(shè)計制作的素材應(yīng)用多；色系、布局合理美觀、 考慮用戶訪問方便；