各位先進大神好
小弟任職為非網頁相關coding工作，對網頁全端技術有興趣但還只算是新手
老闆最近開出需求，希望小弟可以做出網頁給客戶
老闆也願意補助小弟去針對所需工具去學習
所以需要對整體架構評估規畫確認可行性
因此想詢問各位大神，建議使用哪些工具方便將底下條件呈現於網頁供使用者操作?
======
需求如下：
1.
在網頁A開啟後
讀取DataBase後，產生對應數量的各種類物件
滑鼠點擊物件後可將其中一物件拿起來
到特定區域後再點擊一次，就可以將東西放下
最後將所有被放置於特定區域的物件資料存回至DataBase供其他網頁讀取使用
(滑鼠操作的部分也可以使用壓住滑鼠左鍵拖曳的方式)
並且之後可以隨時回來此頁面，對物件於特定區域的位置點調整
2.
在網頁B中
舉例來說有一個20孔網路分享器跟5台電腦
開啟頁面後讀取DataBase，確定目前的接線狀況(也可能事都沒有接線)
然後如同國小課本連連看一樣，網路分享器的某一孔洞會連線對應至某一台電腦
滑鼠可以先點1號孔，然後點擊2號電腦，之後就會進行連線
或者用拖曳的方式也行
希望可以做到有簡易拉線動畫的呈現
最後再將結果存回DataBase，並且也可隨時回來進行修改接線情形
3.
開論壇社群討論區
4.
可支援手機瀏覽器進行瀏覽，並延伸建立專屬相對應的APP
也希望於手機可以做到上述第1點與第2點的手勢效果
======
目前初步規劃主要框架是 一般的PHP + HTML5 + MariaDB Server(MySQL)
動畫的部分原先考慮結合Flash呈現
但是因為Flash手機向性太差，所以再想有沒有其他方式可以處理
目前自行爬文Google，查到可能可以達成的相關Tool之Keyword可能有：
SVG
CSS3
java script
jQuery
D3.js
Canvas
Adobe Animate CC
但對於這些工具還不熟悉，也不確定能不能達成上述目的
希望大神們可以幫忙協助分析
謝謝，感激不盡...