Created With

link實習日誌 20221102

link10:00 討論日後安排

和人資討論,目前規劃周二四去媒體部,周三五去工程部。

因為媒體是我完全沒學過的領域,人資說我能在媒體部撐一天已經很厲害了。

和工程部導師加 LINE 好友。透過 LINE 拿到網址,開啟工程師實習生任務清單的 Google Spreadsheet,試算表的欄位有日期、我的名字、我的報到日、哪兩天要去上班、預計進度、完成進度、時間、參考資料。

導師說 GitHub 的免費方案中專案只能是公開的,GitLab 則可以設定成私人,因為有些專案是公司的機密所以使用 GitLab。

link10:30 準備環境

任務清單:

  1. 環境安裝 (Git, XAMPP, Composer)
  2. 申請 GitLab 帳號,將專案拉下來
  3. 研究 code

link環境安裝

軟體所需版本編號
Git穩定版本就好
XAMPPPHP 7.0 就好
Composer穩定版本就好

參考資料:

  1. git 教學
  2. git
  3. composer
  4. xampp安裝 7.0版本 下載網址

這三個軟體我都安裝過,所以研究各自的更新方法:

Git:執行命令列指令 git update-git-for-windows 更新 Git。

執行 git --version 得知目前版本編號是 2.38.1.windows.1

How to Upgrade git to the Latest Version on Windows

XAMPP:下載最新版並安裝,中午和導師討論,他說只要 PHP 版本有 7.0 就好。

執行 php --version 得知目前版本編號是 7.4.7

如果要更新整個 XAMPP 的話可參考 Upgrading Xampp without re-installing ?

link12:30 午餐

餐廳:杉SHAN 台北松山店

我點了蔥油低烹雞胸肉_輕盈餐盒 $150,內容物有清爽小黃瓜、高蛋白毛豆仁、烤綜合菌菇、紫米白飯、生菜、蔥油低烹雞胸肉。


link13:30 回到公司

繼續處理任務。

Composer:安裝 Composer 之前要先安裝 PHP,所以排在 XAMPP 之後。

我自己執行更新 Composer 的指令 php composer.phar self-update 後顯示無法讀取 composer.phar 檔案,所以改成下載最新版並安裝。

執行 composer --version 得知目前版本編號是 2.4.4。

後來嘗試執行 composer self-update,出現我已經在用最新版本的訊息,表示日後可以用這個指令做更新。

self-updateDownload Composer

link申請 gitlab 帳號,將專案拉下來

參考資料:

  1. GitLab
  2. c:/xampp/htdocs/ 右鍵 選 git bash => 打指令 git clone 專案網址
  3. 都安裝完成後就可以試試看這個網址 http://127.0.0.1/專案名稱/public/index.html

因為 Git Bash 無法貼上專案網址所以改用命令提示字元,執行 git clone 之後出現登入 GitLab 的視窗,登入帳號再稍等一下之後下載儲存庫。

開啟 xampp-control.exe,啟動 Apache 和 MySQL,在本機的瀏覽器開啟 index.html,得知這個專案是在介紹數位帳戶。

link研究 code

大概看一下三個網頁的執行結果與原始碼。詢問導師研究 code 具體來說應該研究什麼,他說可以觀察程式碼與檔案的結構、有什麼可以改進的地方,建議我觀察我較不擅長的 JS 部分,做個筆記之後報告。

我問他有沒有考慮過用 SASS,他說會用當然是好事,不過當時這個網站的切版時間只有一周,而且是大一還是大二的實習生做的。也有過一位實習生會用 SASS 另一位不會的情況。

筆記:

  1. HTML 檔案的 <head> 的內容依序是 <title>, SEO <meta>, <link favicon>, <link css>, <style>, <script> for Google Tag Manager
  2. 有用到 animate.css, Bootstrap.css, Font-Awesome
  3. HTML 檔案的 <body> 的內容依序是右側固定按鈕、頁首、主要區塊、頁尾、<script src=""></script>, <script> JS, jQuery </script>
  4. 有用到 jQuery, Bootstrap.js, wow.js
  5. 外部 CSS 和 JS 檔案,用 CDN 引入、保存在專案中再引入,載入速度哪個比較快?導師說後者比較快

改進:

  1. CSS 放在獨立檔案,例如 <link rel="stylesheet" href="./css/style.css" />,避免 <style> CSS </style><p style=""></p>
  2. 區塊之間換行
  3. <div onclick=""></div> 換成 <a href="">
  4. JS 放在獨立檔案,避免 <script> JS </script>

link16: 30 討論理解狀況

專案內 HTML 和 CSS 的部分大致理解,動畫、JS 和 jQuery 部分尚未理解。

Transition 是一次性的,Animation 可以重複多次。

Day27:小事之 Transition 與 Animation

都給我動起來! Animate.css 分享

都給我動起來! WOW.js 分享

link17:00 數位帳戶一屏

"一屏"指的是網頁的第一個畫面,二屏就是第二個畫面,以此類推。老師推薦我自己寫看看一屏就知道自己理解與否,於是我在專案資料夾內新增 imitation.html, imitation.scss, imitation.css,來仿製首頁的一屏。

link19:00 下班

link今日心得

我昨天去媒體部的時候,網址都是一個一個傳過來的,要自己收集。相比之下,工程部的導師有事先列出任務清單和參考資料,把各種網址集中在一起,真是太好了。

實習日誌 2022110210:00 討論日後安排10:30 準備環境環境安裝12:30 午餐13:30 回到公司申請 gitlab 帳號,將專案拉下來研究 code16: 30 討論理解狀況17:00 數位帳戶一屏19:00 下班今日心得

Home

得到機會chevron_right

實習日誌chevron_right
202211 日誌chevron_right
202212 日誌chevron_right
202301 日誌chevron_right
202302 日誌chevron_right
202303 日誌chevron_right
202304 日誌chevron_right

任務成果chevron_right
任務清單chevron_right

實習結束chevron_right

返回個人網站