--- title: Interview tags: 前端技術面試 --- ## 問題 ### 01 * 目前的專案,負責開發哪些部分?從頭開始的開發or維護or維護兼開發? * 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? * 組件化/模組化開發的經驗,現有專案,哪些功能你寫成共用組件?稍微講解你寫過的比較有印象的共用組件,大致上做了哪些功能? * Vue有寫過Nuxt?(React有寫過Next)? * 麻煩你稍微描述一下CSR/SSR/SSG (Static Site Generation),優缺點各是什麼? * React使用Hook? 是否寫過class?(16.8以前stateful只能用class) * Vue或前端,的實際優化經驗?像是可以描述你做了些什麼?優化前後差異? * code減肥 * 懶加載lazy loading實作經驗(React/Vue/Angular/webpack) * api fetching axios 攔截器 interceptor實作經驗? 你做了什麼? * 多國語系i18n實作經驗 * CSS UI framework(Vuetify/ant design/ material ui)使用經驗? * styled-component(以及CSS in JS)的理解跟看法,跟global的差異 * ==Vue==/deep/ * ==Angular==:host ::ng-deep * 有沒有做過支援IE或非主流瀏覽器的網站,遇到的困難點是? * 有提到TypeScript,TypeScript用在哪些專案?覺得如何?搭配React/Vue使用? * 有提到Node.js,實作了哪些? * 有無Nginx使用經驗,對它的理解為?(反向代理寫在Nginx跟寫在前端框架內,你覺得優缺點在哪) * 有無做筆記的習慣?用什麼平台?或者做side project的習慣? * 近幾年遇到最大的最有印象的難題/最難解的bug,後來如何解決? * 工作上跟其他同事有衝突,你會如何解決? React16.0->17.0.2 class/functional React+webpack/CRA Next.js/TypeScript/i18n Redux/Context API/react query styled-component/ Chakra UI node.js/Nginx svn/git * 對於公司的技術棧(使用的工具),還有什麼想了解的嗎? --- ### 02 1.5程式 1.5切版 4年設計 1+3共4年的企劃 * 目前職位是企劃嗎? 為什麼會想來這邊應徵? * 有PM相關經驗, 若對接人員(客戶)是非本行相關的, 你會怎麼去引導或溝通? 我的字要大一點, 我的字要小一點, 我想改什麼顏色? 如何溝通需求, 以提高溝通的效率. * PM對於專案的企劃, 你做了些什麼? * * 版控的部分, 你們團隊是怎麼做git flow? 如果只有你一個人, 你會怎麼做? * * 設計的部分, 你設計的是遊戲畫面嗎? * * Vue框架開發, 你負責哪些部分? 對Vue的了解有多少? 後台畢竟以功能為主, 那你有沒有優化經驗? 畢竟是後台, 那你有沒有RWD經驗? menu 是否有手機板經驗? * * 軟體有看到你用Sublime, 那是否會用VSCode? * * 若請你負責設計+切版部分, 你會使用哪些技術棧(工具軟體) SCSS? pug? 常用的plug in? * * 如果有需要基本接API, 你會怎麼接? pure HTML, Vue? or? ------------------ ### 03 * 看到你的履歷, 工作技能是設計為主,對於JS開發經驗有多少? 做切版工作時, 除了套用jQuery等plug-in, 有沒有自己寫JS邏輯功能的經驗? * 有看到使用Vue3, 除了套版, 你做了些什麼? 例如說, 你現有專案,哪些功能你寫成共用組件?稍微講解你寫過的比較有印象的共用組件,大致上做了哪些功能? * Vue或前端,的實際優化經驗?像是可以描述你做了些什麼?優化前後差異? * code減肥 * 懶加載lazy loading實作經驗(React/Vue/Angular/webpack) * Vue有寫過Nuxt? * 我們公司現有專案, 有使用框架的, 前端都是React (Next.js), 目前對React認知有多少? * 除了用圖形化介面的Git(使用 Tortoise Git 作為 Git UI 操作), 對於git指令, 你大概知道哪些? * 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? * 麻煩你稍微描述一下CSR/SSR/SSG (Static Site Generation),優缺點各是什麼? * api fetching axios 攔截器 interceptor實作經驗? 你做了什麼? * 多國語系i18n實作經驗 * 有沒有做過支援IE或非主流瀏覽器的網站,遇到的困難點是? * 是否有使用TypeScript做專案的經驗? * 有無Nginx使用經驗,對它的理解為?(反向代理寫在Nginx跟寫在前端框架內,你覺得優缺點在哪) * 有無做筆記的習慣?或者做side project的習慣? * 工作上遇到最大的最有印象的難題/最難解的bug,後來如何解決? ------------------ ### 04 * 看到你的履歷, 工作內容以設計切版為主,對於JS開發經驗有多少? 做切版工作時, 除了套用jQuery等plug-in, 有沒有自己寫JS邏輯功能的經驗?或者改寫套件?(套件功能無法滿足需求) * 使用Vue是Vue2還是Vue3? 除了套版, 你做了些什麼? 例如說, 你現有專案,哪些功能你寫成共用組件?稍微講解你寫過的比較有印象的共用組件,大致上做了哪些功能? * Vue或前端,的實際優化經驗?像是可以描述你做了些什麼?優化前後差異? * code減肥 * 懶加載lazy loading實作經驗(React/Vue/Angular/webpack) * Vue有寫過Nuxt? * 我們公司現有專案, 有使用框架的, 前端都是React (Next.js), 目前對React認知有多少? * 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? 對於git指令, 你大概知道哪些? * 麻煩你稍微描述一下CSR/SSR/SSG (Static Site Generation),優缺點各是什麼? * api fetching axios 攔截器 interceptor實作經驗? 你做了什麼? * 多國語系i18n實作經驗 * 有看到寫到解決跨瀏覽器經驗, 解釋一下~有沒有做過支援IE或非主流瀏覽器的網站,遇到的困難點是? * 是否有使用TypeScript做專案的經驗? * 有沒有做過佈署相關(node/nginx),有看到跟後端溝通的經驗,對資料庫有沒有初步了解? * 工作上遇到最大的最有印象的難題/最難解的bug,後來如何解決? --- ### 05 * 邏輯面、資料庫的串接以及規劃、Restful API的規劃、因為擔任過PM角色,在溝通面上,能用客戶/工程師的語言,去做溝通...等等;履歷上的文字描述,已能展現實力。 * 團隊合作經驗?、git 使用經驗 => 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? 對於git指令, 你大概知道哪些? * CSS能力 => 切版、RWD、有沒有做過支援IE或非主流瀏覽器的網站,遇到的困難點是? * 多國語系 * tech stack: PHP、jQuery、React(Next.js)、Node.js、MQL;MySQL 5.6.16 --- ### 06 * 藝化,後台為PHP、前台React+Express * 資料庫使用MySQL, 是誰架的?雲端? * CSS library, 為什麼選了Bootstrap又使用Material UI? * 後台CMS負責什麼? * 團隊合作經驗?、git 使用經驗 => 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? 對於git指令, 你大概知道哪些? * 專案是否有佈署到網路上 * tech stack: PHP、jQuery、React(Next.js)、Node.js、MQL;MySQL 5.6.16 --- ### 07 * 目前的專案,負責開發哪些部分?從頭開始的開發or維護or維護兼開發? * 協助團隊導入代碼規則與格式化(eslint、prettier、husky、lint staged) * 有看到GraphQL, 現有專案使用GraphQL? 覺得它的優點/缺點是什麼? * 團隊開發使用git的經驗,git flow當時分支怎麼控管?多人開發如何去分配(by功能or每個人拉一個分支or?) 解衝突經驗? * 導入commitlint 規範配合git flow開發 * 組件化/模組化開發的經驗,現有專案,哪些功能你寫成共用組件?稍微講解你寫過的比較有印象的共用組件,大致上做了哪些功能? * 麻煩你稍微描述一下CSR/SSR/SSG (Static Site Generation),優缺點各是什麼? * React 的實際優化經驗?像是可以描述你做了些什麼?優化前後差異? * 有沒有做過支援IE或非主流瀏覽器的網站,遇到的困難點是? * 有提到TypeScript,TypeScript用在哪些專案?覺得如何? * Next.js 做了哪些事情? * 有提到Node.js,實作了哪些? * 前端活動網頁讓使用者填寫"交易帳號" * 後端確認 * 資料庫新建table, 每15分鐘, 去打B2的API, 匯出交易帳號及其對應的信箱 * 該table需要有的欄位 * 交易帳號 * 對應的信箱 * 抽獎過了沒? * 若已抽獎, 那中獎獎項是什麼? * 該交易帳號還沒玩過遊戲 * 該交易帳號有留下對應信箱(以寄送中獎結果) * 前端讓使用者玩轉盤遊戲 * 需要轉盤動畫, 以及停止特效 * 後端回傳轉盤遊戲的隨機結果 * |選項 |機率| |-----|---| |USD5 |20%| |USD15|20%| |USD25|20%| |USD35|15%| |USD45|15%| |USD50|10%| |IPhone 14 Pro Max| 0%| |Tesla Model Y | 0%| |Tesla Model Y | 0%| * 若寫在前端可能結果被竄改 * 後端寄送中獎結果給 * 中獎人 * WCG * 前端顯示"中獎結果已寄送至您信箱, 請靜待客服確認後通知" * ==WCG提供這段的話術== * 紀錄轉盤遊戲的中獎結果, 並且能讓WCG查詢到結果?? USD5 20% USD15 20% USD25 20% USD35 15% USD45 15% USD50 10% IPhone 14 Pro Max 0% Tesla Model Y 0% Tesla Model X 0%