Coder Social home page Coder Social logo

jenjan_frontend_recruit's Introduction

JENJAN Frontend Recruit

題目要求

  • 依照 Figma 畫面製作相應 UI 及功能
  • 製作 UI 1-1、1-2 (相似度盡可能高)
  • 使用 axios 獲取 API 資料並顯示
  • 前端框架使用 Vue 3 並以 CDN 方式引入參考
  • UI 框架使用郵件中的附檔 bootstrap.min.css，且盡量無額外撰寫的 css
  • 圖示部分使用 Bootstrap Icon
  • 需有 RWD (簡易調整不要爆版即可，自由發揮)
  • 使用 html 直接開發，不可使用 node js 或其他構建工具

功能說明

  • 可輸入物流單號於中間的輸入框中
  • QR Code 按鈕不需要有功能
  • 查詢包裹 與 查詢不明包裹 可以點擊切換 (純切換即可，無須關聯擊他功能)
  • 按下 查詢 時 1-1 畫面移至左側 (不用動畫)，並顯示右方表格
  • 按下清除按鈕清空輸入框中的文字即可，不用切換顯示狀態 (1-1/1-2)

備註

  • 實心藍按鈕為 btn-primary
  • 空心按鈕為 btn-outline-transparent
  • 查詢不明包裹 按鈕使用的是 btn-transparent
  • QR Code icon
  • 地球 icon

jenjan_frontend_recruit's People

Contributors

nickhuang1123 avatar

Watchers

avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.