主頁 > 前端設計 > “我轉行做前端的這一年多,月薪3K變成了15K”,前端的自白

“我轉行做前端的這一年多,月薪3K變成了15K”,前端的自白

2021-04-23 11:06:27 前端設計

我來深圳的這一年

我特別喜歡vae,最佳歌手里有這么一句話:我們最好的遇見是這樣的四月,

19年四月,我在南下的火車上來到了深圳市,

20年四月,我被公司裁員,也許這就是命吧,

我苦逼的作業經歷

19年6月6號,是我轉行做前端的第一天,

16年7月在一家電商公司做電商專員,定位北京,3k,10月去上海分公司,月薪2.7k,

17年10月,辭職回家,打了半年dota,

18年3月,在武漢東方xx做測驗,5.5k,其實就是做實施,

19年4月來深圳,當時心里慌的一筆.每天學習6-8個小時,看B站的視頻以及別人推薦的電子書,后面我會分享我的學習經歷,

19年6月6號找到第一份前端作業,軟基,6.5k,

19年9月跳槽box(之前經常被拖欠工資),軟基9.5k,

20年4月,被box裁員,深受打擊,

20年5月,入職xxx,定位深圳15k,

說說我的前端作業

做前端也快兩年了,感觸還是很多的,

一年多來,技術主要是vue和小程式,

記得我做的第一個需求就是用canvas畫海報然后分享出來,

做的是一個父親節的活動,

第一天上班就加班到72路末班車沒趕上 自費打車回來,

從一個完全不會聯調介面到完成需求花了一個星期,

當時還是很開心的,

除了前端技術方面的提升 還遇到很多很好的人,

雖然跳槽是很頻繁(其實我也不想的),

但有得有失吧,

近兩年的作業總結

從19年六月到今天,快兩年的時間,

說實話 還是很心酸的,

從一個前端頁面寫不好到現在勉強算個前端入門工程師,

不得不說 還是付出了一些努力的(剛有點松懈就被box裁員了),

對自己這一年 總體來說,

不算是特別的滿意的(被裁真的很傷),

希望今年能保持 學習的勁頭,

不要BB說沒時間學習,

你談戀愛就有時間了,

你玩LOL怎么不說沒空,

將你等待她訊息的心(我是個無下限的舔狗),

用在學習上吧,

我也經常在高峰期的地鐵上看到很多人在學習,

所以 不要找那么多的借口,

轉行學習方法

我要說明我大學學習的是計算機科學與技術專業,這對于學習前端來說,最多是多了點基礎,還有對計算機更了解點,上手可能相對快一點,

人都是對比出來的,所以對于不同的人來說,學習程度和能力都不同,還有我是自學的,這里我寫的學習路線僅供參考,

一、開始做就對了,學習HTML+CSS,完成靜態頁面

建議跟著視頻教程實踐,網上視瞥澩很多,B站一大把,找兩三個順眼順耳的資源就行了,這個階段就是熟悉各種標簽,屬性,樣式以及用法,達到目標:能按照已有網頁進行 模仿和撰寫

對了,對于小白,我推薦使用 HbuilderX 編輯器,因為小,打開快,而且內嵌頁面預覽,再者用瀏覽器打開的時候就自動構建了本地服務器(幫助加載資料),不用自己再設定,

這時期不要思考太多東西,好好享受所寫及所得的成就感,好好記住這種感覺并在以后的學習中都不要忘記,這可作為你的初心的一部分,

二、學會用瀏覽器的控制臺,繼續學習JavaScript,做動效互動的網頁

總體上就是,看視頻教程后實踐+看檔案實踐,

視瞥澩和上面差不多,找一個順眼順耳的就刷它,文黨澩推薦廖雪峰和阮一峰兩位大神寫的,

除了前面需要掌握的搜索問題的能力,這個階段需要會 使用瀏覽器的控制臺,知道怎么看一個網站的HTML原始碼,如何修改樣式,斷點控制等等,達到目的:可利用控制臺多研究自己所見的網站是怎么互動和動效展現的,這階段就是邊刷基礎知識,邊多多實踐,最好自己做個完整的網站,包括資料加載,頁面加載和互動效果,

三、多發現,深入學習,學透前端基礎知識

老實說這個階段是不斷嘗試新東西,然后不斷 整合自己的知識體系的時候,

這個時期,你會同時繼續深入學習HTML5,CSS3,懂得用最新的標簽和樣式寫頁面,同時也意識到瀏覽器之間的兼容問題;你想要加載資料,所以你學習AJAX異步加載資料,學習JSON存盤資料;你想要簡化JavaScript的書寫,所以你學習jQuery,盡管它現在不火了;你想要做回應式頁面,所以你學習Bootstrap框架;你想要做移動端頁面,學習不同的移動端布局方式;你看到現在博文在說前端火熱的框架三巨頭,你也去嘗試了一下Vue……

然而所有的面試題和招聘的崗位要求都告訴你,你還遠遠不夠!你不會用代碼托管,不會打包代碼,不會使用自動化工具……

是的,你迷茫了,感徑訓有好多要學,但是已經學的還沒吃透,盡管你學習了常用的前端知識,盡管你做出了自己的網站,盡管你還在努力……

這個時候,我的做法是 多看博客,看面試題,核對前端學習路線,這樣你會知道自己還有哪些方面還不夠好,不用一下子就接受所有,每天進步一點點,

這個階段的目標:知道自己哪里不足補哪里,知道該怎么學習下去,這是關乎學習心態,學習視野和學習效率方面的博弈,

最后

請不要忘記,還有幾個重要的能力需要掌握,搜索資源的能力,學習能力,解決問題的能力,英文閱讀的能力,是的,你要繼續下去就必須學好英文,這樣才能看到更多先進的技術,

前端學習內容復雜、網上資料良莠不齊,想要靠自己梳理清楚確實不容易,為了幫助想要在這條路上一路走到黑的朋友,我梳理了各個大廠前端工程師常考必考的面試題型,總結出這「400 道前端工程師常考必考面試題 + 詳細解答」


想學習前端web和需要PDF檔案的朋友都可以加入這邊的交流裙,前面:938,,中間:051,,最后:673

裙里從學生到大佬都有,資源免費分享,不見不散哦!

轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/279281.html

標籤:其他

上一篇:350頁前端校招面試題直擊大廠:前端基礎、前端核心、計算機基礎、專案、Hr面...

下一篇:vue+element-ui 這樣的表用el-table該怎么做?

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • vue移動端上拉加載

    可能做得過于簡單或者比較low,請各位大佬留情,一起探討技術 ......

    uj5u.com 2020-09-10 04:38:07 more
  • 優美網站首頁,頂部多層導航

    一個個人用的瀏覽器首頁,可以把一下常用的網站放在這里,平常打開會比較方便。 第一步,HTML代碼 <script src=https://www.cnblogs.com/szharf/p/"js/jquery-3.4.1.min.js"></script> <div id="navigate"> <ul> <li class="labels labels_1"> ......

    uj5u.com 2020-09-10 04:38:47 more
  • 頁面為要加<!DOCTYPE html>

    最近因為寫一個js函式,需要用到$(window).height(); 由于手寫demo的時候,過于自信,其實對前端方面的認識也不夠體系,用文本檔案直接敲出來的html代碼,第一行沒有加上<!DOCTYPE html> 導致了$(window).height();的結果直接是整個document的高 ......

    uj5u.com 2020-09-10 04:38:52 more
  • WordPress網站程式手動升級要做好資料備份

    WordPress博客網站程式在進行升級前,必須要做好網站資料的備份,這個問題良家佐言是遇見過的;在剛開始接觸WordPress博客程式的時候,因為升級問題和博客網站的修改的一些嘗試,良家佐言是吃盡了苦頭。因為購買的是西部數碼的空間和域名,每當佐言把自己的WordPress博客網站搞到一塌糊涂的時候 ......

    uj5u.com 2020-09-10 04:39:30 more
  • WordPress程式不能升級為5.4.2版本的原因

    WordPress是一款個人博客系統,受到英文博客愛好者和中文博客愛好者的追捧,并逐步演化成一款內容管理系統軟體;它是使用PHP語言和MySQL資料庫開發的,用戶可以在支持PHP和MySQL資料庫的服務器上使用自己的博客。每一次WordPress程式的更新,就會牽動無數WordPress愛好者的心, ......

    uj5u.com 2020-09-10 04:39:49 more
  • 使用CSS3的偽元素進行首字母下沉和首行改變樣式

    網頁中常見的一種效果,首字改變樣式或者首行改變樣式,效果如下圖。 代碼: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ......

    uj5u.com 2020-09-10 04:40:09 more
  • 關于a標簽的講解

    什么是a標簽? <a> 標簽定義超鏈接,用于從一個頁面鏈接到另一個頁面。 <a> 元素最重要的屬性是 href 屬性,它指定鏈接的目標。 a標簽的語法格式:<a href=https://www.cnblogs.com/summerxbc/p/"指定要跳轉的目標界面的鏈接">需要展示給用戶看見的內容</a> a標簽 在所有瀏覽器中,鏈接的默認外觀如下: 未被訪問的鏈接帶 ......

    uj5u.com 2020-09-10 04:40:11 more
  • 前端輪播圖

    在需要輪播的頁面是引入swiper.min.js和swiper.min.css swiper.min.js地址: 鏈接:https://pan.baidu.com/s/15Uh516YHa4CV3X-RyjEIWw 提取碼:4aks swiper.min.css地址 鏈接:https://pan.b ......

    uj5u.com 2020-09-10 04:40:13 more
  • 如何設定html中的背景圖片(全屏顯示,且不拉伸)

    1 <style>2 body{background-image:url(https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture); 3 background-size:cover;background ......

    uj5u.com 2020-09-10 04:40:16 more
  • Java學習——HTML詳解(上)

    HTML詳解 初識HTML Hyper Text Markup Language(超文本標記語言) 1 <!--DOCTYPE:告訴瀏覽器我們要使用什么規范--> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <!--meta 描述性的標簽,描述一些 ......

    uj5u.com 2020-09-10 04:40:33 more
最新发布
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 07:59:23 more
  • 生產事故-走近科學之消失的JWT

    入職多年,面對生產環境,盡管都是小心翼翼,慎之又慎,還是難免捅出簍子。輕則滿頭大汗,面紅耳赤。重則系統停擺,損失資金。每一個生產事故的背后,都是寶貴的經驗和教訓,都是專案成員的血淚史。為了更好地防范和遏制今后的各類事故,特開此專題,長期更新和記錄大大小小的各類事故。有些是親身經歷,有些是經人耳傳口授 ......

    uj5u.com 2023-04-18 07:55:04 more
  • 記錄--Canvas實作打飛字游戲

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 打開游戲界面,看到一個畫面簡潔、卻又富有挑戰性的游戲。螢屏上,有一個白色的矩形框,里面不斷下落著各種單詞,而我需要迅速地輸入這些單詞。如果我輸入的單詞與螢屏上的單詞匹配,那么我就可以獲得得分;如果我輸入的單詞錯誤或者時間過長,那么我就會輸 ......

    uj5u.com 2023-04-04 08:35:30 more
  • 了解 HTTP 看這一篇就夠

    在學習網路之前,了解它的歷史能夠幫助我們明白為何它會發展為如今這個樣子,引發探究網路的興趣。下面的這張圖片就展示了“互聯網”誕生至今的發展歷程。 ......

    uj5u.com 2023-03-16 11:00:15 more
  • 藍牙-低功耗中心設備

    //11.開啟藍牙配接器 openBluetoothAdapter //21.開始搜索藍牙設備 startBluetoothDevicesDiscovery //31.開啟監聽搜索藍牙設備 onBluetoothDeviceFound //30.停止監聽搜索藍牙設備 offBluetoothDevi ......

    uj5u.com 2023-03-15 09:06:45 more
  • canvas畫板(滑鼠和觸摸)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>canves</title> <style> #canvas { cursor:url(../images/pen.png),crosshair; } #canvasdiv{ bo ......

    uj5u.com 2023-02-15 08:56:31 more
  • 手機端H5 實作自定義拍照界面

    手機端 H5 實作自定義拍照界面也可以使用 MediaDevices API 和 <video> 標簽來實作,和在桌面端做法基本一致。 首先,使用 MediaDevices.getUserMedia() 方法獲取攝像頭媒體流,并將其傳遞給 <video> 標簽進行渲染。 接著,使用 HTML 的 < ......

    uj5u.com 2023-01-12 07:58:22 more
  • 記錄--短視頻滑動播放在 H5 下的實作

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 短視頻已經無數不在了,但是主體還是使用 app 來承載的。本文講述 H5 如何實作 app 的視頻滑動體驗。 無聲勝有聲,一圖頂百辯,且看下圖: 網址鏈接(需在微信或者手Q中瀏覽) 從上圖可以看到,我們主要實作的功能也是本文要講解的有: ......

    uj5u.com 2023-01-04 07:29:05 more
  • 一文讀懂 HTTP/1 HTTP/2 HTTP/3

    從 1989 年萬維網(www)誕生,HTTP(HyperText Transfer Protocol)經歷了眾多版本迭代,WebSocket 也在期間萌芽。1991 年 HTTP0.9 被發明。1996 年出現了 HTTP1.0。2015 年 HTTP2 正式發布。2020 年 HTTP3 或能正... ......

    uj5u.com 2022-12-24 06:56:02 more
  • 【HTML基礎篇002】HTML之form表單超詳解

    ??一、form表單是什么

    ??二、form表單的屬性

    ??三、input中的各種Type屬性值

    ??四、標簽 ......

    uj5u.com 2022-12-18 07:17:06 more