iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Modern Web

給心理人的前端網頁開發 系列

現代心理學的研究,常常會用到許多數位工具,例如統計軟體、電子問卷。網路與網頁的誕生,讓心理學研究的方法更加多元化。在這系列文中,將簡單介紹與教學前端語言三本柱:HTML、CSS、JavaScript,最後帶到實做網頁問卷、以及網頁心理學實驗。

你是心理人,對程式的世界有興趣嗎?
你是程式人,對心理學的研究感到好奇?
你是一般人,對這個混合領域感到陌生?

邀請您一同參與程式※心理學的奇幻之旅

鐵人鍊成 | 共 30 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 1

[給心理人的前端網頁開發] 01 前言:參賽目的

這次參賽的主題是我想寫想很久了:心理學與前端網頁開發,兩個我有興趣的領域。我在高中時,因為對生物以及哲學有興趣,覺得心理學是兩門學科的綜合體(後來發現這兩門學科...

2023-09-16 ‧ 由 ayugioh2003 分享
DAY 2

[給心理人的前端網頁開發] 02 背景知識介紹

在這篇介紹中,將簡單介紹兩個領域:心理學、前端網頁開發 一、心理學 心理學是一門研究人類行為與心智歷程的學科,也算是一個年輕的學科。現代心理學於 1879 年,...

2023-09-17 ‧ 由 ayugioh2003 分享
DAY 3

[給心理人的前端網頁開發] 03 關卡〇:新手入門之說聲 Hello World

在剛開始學寫程式時,有個不成文的習慣:先讓螢幕顯示出 Hello World 這串文字,代表程式有在正常運作、讓新手知道自己已經能正式運行一個程式起來了,可能就...

2023-09-18 ‧ 由 ayugioh2003 分享
DAY 4

[給心理人的前端網頁開發] 04 關卡〇:簡介 HTML

在文章〈關卡〇:新手入門之說聲 Hello World〉,我們看到了 HTML、CSS、JavaScript 如何組合成一個網頁。不過 HTML 究竟是什麼、以...

2023-09-19 ‧ 由 ayugioh2003 分享
DAY 5

[給心理人的前端網頁開發] 05 關卡〇:簡介 CSS

在文章〈關卡〇:新手入門之說聲 Hello World〉,我們看到了 HTML、CSS、JavaScript 如何組合成一個網頁。不過 CSS 究竟是什麼、以及...

2023-09-20 ‧ 由 ayugioh2003 分享
DAY 6

[給心理人的前端網頁開發] 06 關卡〇:簡介 JavaScript

在文章〈關卡〇:新手入門之說聲 Hello World〉,我們看到了 HTML、CSS、JavaScript 如何組合成一個網頁。不過 JavaScript 究...

2023-09-21 ‧ 由 ayugioh2003 分享
DAY 7

[給心理人的前端網頁開發] 07 關卡〇:簡介開發環境

前面我們介紹了寫網頁會用到的語言:HTML、CSS、JavaScript。但其實在寫程式時,有一個前置作業是必須的:也就是準備開發環境。 開發環境是個很廣泛的用...

2023-09-22 ‧ 由 ayugioh2003 分享
DAY 8

[給心理人的前端網頁開發] 08 自介履歷之開發環境 - codesandbox

在關卡一中,我們將寫出一個自介履歷網頁。不過我們先來介紹一下開發環境:codesandbox,並用此開發環境複習一下 Hello World 範例。明天才正式開...

2023-09-23 ‧ 由 ayugioh2003 分享
DAY 9

[給心理人的前端網頁開發] 09 關卡一:自介履歷之 HTML

今天要開始正式寫一個履歷網頁了。主角是一個新興 Vtuber 叫 HowB8,履歷網頁有他的頭貼、設定、經歷與作品集。請先點開連結查看效果: [給心理人的前...

2023-09-24 ‧ 由 ayugioh2003 分享
DAY 10

[給心理人的前端網頁開發] 10 關卡一:自介履歷之 CSS

關卡一是幫一個人物寫履歷網頁,主角是一個新興 Vtuber 叫 HowB8,履歷網頁有他的頭貼、設定、經歷與作品集。請先點開連結查看效果: [給心理人的前端...

2023-09-25 ‧ 由 ayugioh2003 分享