<aside> 💡 對於時常要與工程師溝通、討論實作方向的 PM 來說，了解產品的技術架構確實有一定的重要程度。這並非是要你每個語言都會寫（不然去當全端工程師就好了）、而是要你能大概知道有哪些技術框架，以便你在分析自身產品或研究競品時多一些技術上的了解。
因此在這一章節，想要提供給大家一個實用的小工具：「Wappalyzer」，讓不是技術背景的你也可以快速窺探網路產品背後的技術架構！
</aside>
平時在我想要了解客戶或競品的網頁架構時，會選擇開啟 Dev Tool 來檢視 HTML code，包含 header、body 中藏了什麼東西，而有時候也會在排查問題時有一些意料之外的發現，例如說客戶也偷裝了我們競品的 code、並且在做流量分配或 A/B Test 等等。
不過對於 PM 這個職位、或是非技術背景的人來說，要把 code 一層層打開並檢視其內容確實很麻煩又燒腦，雖然說如果是做細部的問題排查確實免不了要這樣做，但如果只是想了解這個網站使用的技術框架（比如用哪個語言寫的、函式庫、框架、第三方追蹤工具等），那藉由這個小工具確實能幫上你不少忙！
所以假如你有以下的需求，那麼這個小工具就非常值得你使用：
✔ 與工程師溝通時會需要討論到一些架構問題
✔ 想知道競品都在用什麼技術框架和工具
✔ 想窺探眾多網站背後的技術架構（可能基於個人好奇、或想了解客戶）
✔ 最近團隊想招募擅長特定程式語言的工程師
✔ 之後想面試其他公司的產品 PM 職缺
OK～接著我們來進入正題，帶大家看一下 Wappalyzer 要如何使用吧！
運作方式：
當使用者在瀏覽網站時，Wappalyzer 會自動掃過網站的 HTML、header、Script、cookie ，並得知該網站背後使用的技術和工具，而當使用者想查看相關內容時，只需要在瀏覽器上點擊 Wappalyzer 的 icon 即可得到整理好的分析結果。
運作限制：
由於是瀏覽器上的插件，因此只要是非建立在網頁架構上的產品、非以瀏覽器運作的手機應用程式，就無法使用此工具來進行分析，並且需注意的是：此插件僅支援： Chrome、Firefox 兩個瀏覽器。
如何使用：