iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

以 Kotlin 為主要語言建構基本的 Online Judge 系統 系列

自高中時期開始,就常以程式解題的方式在撰寫程式,不時也在思考「究竟一個 Online Judge 系統到底是如何建構起來的呢?」藉著這次鐵人賽的機會,希望能夠使用我最近喜歡上的程式語言–Kotlin,來建構出一個簡單的 Online Judge 系統。

雖然我目前有先大概查找一下這中間會需要用到哪些技術,但很多技術也都是趁著這個機會第一次去接觸的,難免會有很多實作上不安全、不實用或是描述不清楚的地方,還請大家多多包涵。如果願意在文章下給予意見的話,我會很開心的,非常感謝!

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

Day 21:批改系統網頁 (3) - 模組化視覺元件與單頁路由處理

昨天我們將 React 套件導入了專案中,並且完成了一頁完整網頁的結構。今天我們要嘗試將這個結構模組化,並且利用 React Router 來進行前端網頁的路...

DAY 22

Day 22:批改系統網頁 (4) - 嘗試從資料管理系統抓取資料

昨日我們完成了前端網頁路徑路由的處理,今天就來讓我們對這些路徑能夠從對應的資料管理系統 API 去抓取資料,並將資料顯示在網頁上。 Fetch API 為了要...

DAY 23

Day 23:批改系統網頁 (5) - 利用 styled-components 與 Bootstrap 美化網頁

昨天我們成功地從資料管理系統拉取了資料放在網頁上顯示,但由於目前的網頁實在還是太醜,再繼續將其他資料抓下來之前,就讓我們先來將網頁美化一下吧! CSS 語言...

DAY 24

Day 24:批改系統網頁 (6) - 會員登入狀態確認與會員登入頁面

昨天我們美化了網頁的各個元件,讓它們看起來不再是那麼醜醜的了。在美化完網頁後,我們可以先來把網站的會員系統銜接進來,藉以讓我們方便去處理其他的資料顯示與操作用...

DAY 25

Day 25:批改系統網頁 (7) - 在本地端測試環境中建立 HTTPS 連線

昨天我們建立了登入頁面,但是卻遇到了連線不安全,無法進行跨領域修改 Cookie 的問題。究竟我們該如何建立一個安全的網路,來讓我們的資料管理系統能夠順利地去...

DAY 26

Day 26:批改系統網頁 (8) – 利用 Redux 來進行元件之間的狀態變更

昨天我們建立了 HTTPS 連線,藉以讓使用者可以登入網站。不過雖然已經可以登入網站了,但是卻還是有登入後各個元件之間狀態無法同步資料的問題,究竟我們該如何解...

DAY 27

Day 27:批改系統網頁 (9) – 製作取得資料相關頁面

昨天我們完成了登入與登出相關的操作,接下來就讓我們一步一步完成接下來的頁面吧! 題目總列表頁面 首先先讓我們從獲得題目總列表的資料來顯示的頁面開始吧!雖然我們...

DAY 28

Day 28:批改系統網頁 (10) – 製作操作資料相關頁面

昨天我們將獲取資料的網頁部分給完成了,今天就讓我們繼續將操作資料的網頁部分給完成吧! 表單輸入元件 在操作資料的部分,很常會使用到一些 <input&g...

DAY 29

Day 29:批改系統網頁 (11) – 重新審核程式碼功能與其他雜項

昨日基本上我們已經完成了大致的 Online Judge 系統,剩下基本上就是看你打算要怎麼設計你的 Online Judge 系統來決定該怎麼打造你前端網頁...

DAY 30

Day 30:結語與心得

漫長的九月終於過去了,終於成功地將這三十天的專案和文章都寫完了!明天正好就是連假,可以好好休息了。 首先要在這裡跟大家提到的是,如果在看前面天數的文章中,程式...