Git Product home page Git Product logo

modernweb2019's Introduction

[Modern Web 2019] 趨勢科技 - 誰是效能王

Demo: https://trendmicro-frontend.github.io/modernweb2019

image

活動說明

  • 針對題目範例做表單效能優化,減少重繪次數,現場工作人員驗證後會將結果即時更新在英雄榜。
  • 活動期間:2019/8/28 9:00 到 2019/8/29 14:00
  • 請在活動時間內完成解題,並到趨勢科技櫃台將答案連結交由工作人員驗證,前20名答題者將贈送趨勢科技專屬精美贈品。

活動流程

  1. 參賽者根據海報上的資訊取得此專案網址,並 Fork 回參賽者的 GitHub 帳號下作答。

  2. 參賽者將修改過後的結果 push 回 Fork 的專案中,並且用 GitHub Page 建立 demo site。

  3. 參賽者將 Fork 的專案網址連同 demo site 提供給趨勢科技攤位的工作人員,並留下參賽者的姓名及聯絡方式。

  4. 驗證方式:

    • 用現場工作人員準備的電腦打開參賽者的 GitHub 專案和 demo site
    • 按下 Reset 重製表單
    • 在前 10 筆文字欄位輸入任意資料
    • 確認按下 Submit 可以看到輸入完成的表單資料
    • 確認 form render count 不大於 2

Setup

  1. Fork the repository.

  2. Run npm run start to run a local development server.

  3. Run npm run build to build production code and push the changes to your forked repository.

$ npm run build

> [email protected] build /home/modernweb2019
> cross-env PUBLIC_URL="." react-scripts build

Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  69.64 KB  build/static/js/2.0557ffbf.chunk.js
  3.35 KB   build/static/css/2.7b50253e.chunk.css
  1.95 KB   build/static/js/main.933389c1.chunk.js
  763 B     build/static/js/runtime~main.d653cc00.js

The project was built assuming it is hosted at ./.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.

Find out more about deployment here:

  https://bit.ly/CRA-deploy


> [email protected] postbuild /home/modernweb2019
> rm -rf docs && mv build docs || move build docs
  1. Go to Settings > GitHub Pages and use the /docs folder for GitHub Pages. image

  2. Copy the URL of your published site and update the link in README.md or in the repository's website. image

License

MIT

modernweb2019's People

Contributors

cheton avatar dansnow avatar

Watchers

James Cloos avatar  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.