前端工程師履歷中的專案經驗怎麼寫
有不少前端工程師,在寫履歷時就煩惱。履歷中的項目怎麼寫,怎麼描述。覺得自己雖然工作了好幾年,做過許多項目,但是覺得都沒做什麼高大上的事情,自然就覺得沒啥可寫的。或是覺得做的事情都一樣,寫來寫都那幾樣。
這裡我獻醜,貢獻幾個專案經驗寫法的小實例!
一、第一種專案風格
#專案:騰訊管家前端動畫
作品描述:该项目将一个完整flash剧情动画还原成一个由JS+CSS3实现的前端动画。 链接:https://dxb123456.github.io/tengxun/ 实现技术:CSS+HTML+JS+H5+CSS3+jqury; 项目难点: 1.定时器的清除 部分动画效果需要js自动生成,时间的控制使用了timeout和innertal,其中timerout包含了innertal,点击事件和定时器不在同一个js文件中,快速来回点击的时候,定时器清除不起作用。 解决方案:将该li对应页的所有定时器绑定在该li身上,每次点击的时候清除timeout和innertal。 2.带阴影折线运动处理 对于倾斜的p通过js改变其高度,并且按照数学逻辑改变top和left值的情况下,p在运动时候会出现偏移,和抖动。 解决方案:给p一个运动基准点,这样p在运动的时候就无需改变top和left值,只需要改变宽度或高度即可。 3.抛物线的运动 css中两个点运动都是直线运动。 解决方案:给初始点一个旋转角度,这样看起来就有抛物线的感觉。 4.遮罩层处理 在多层级的html渲染中,中间图层的遮罩效果无法实现。 解决方案:遮罩层可以在最底层使用,但是中间层级的遮罩效果需要对图片进行处理,改成png图片,再进行css操作。 5.卡顿的处理 在Firefox和ie中,小图标的缓慢移动效果会出现卡顿。 解决方案:给运动时间的时候,判断如果不是chrome浏览器,减小运动时间。 6.性能的优化 图片的使用让动画加载的速度变慢,影响用户体验。 解决方案:对部分能使用p代替的图片采用p生成,对代码,图片进行深度压缩上传等。
#二、第二種專案風格
專案一:奕賞
项目描述:本项目是一款手机端APP,采用vue框架构建,其中涉及swiper触控滑动模块,slide子页之间采用了懒加载技术保证用户体验,iscroll上拉加载下拉刷新模块,购物车模块与登录注册模块均采用了本地存储技术。 岗位职责:主要负责页面的布局和数据渲染,并且配合APP完成页面的嵌套。 项目架构: 1.使用vue框架,以及vue-router构建单页面应用。 2.项目采用vuex处理各组件间的通讯,vue-resource处理请求,使用mint-ui组件库中部分功能进行快速开发,通过vue-cli 快速搭建开发环境。 3.采用手机淘宝适配方案。 4.使用阿里矢量图标库。 技术要求: 运用HTML5语义化标签+CSS3新特性进行页面布局,实现页面的动态效果,提高代码的清 晰度和代码质量,将页面体现的更加丰满,代码更健壮。 运用vue.js开发,采用前后端分离开发模式。 运用vue.js中的指令和服务与后台接口对接,进行数据交互,进行页面渲染,实现功能 模块的判断。 使用JavaScript实现某些功能的逻辑处理和某些页面的动态效果。 项目测试阶段可以自己用node连接数据库进行接口对接和数据渲染模拟,测试功能模块 是否完善,逻辑处理是否正确。 运用swiper框架进行部分页面的设计。 运用sass进行代码的编写,运用gulp进行代码的整理和压缩。
專案二:省錢日報
项目描述:本项目是一个促销商品推荐网站的移动APP,使用vue+webpack构建的单页面应用,项目采用了vuex、vue-route、vue-resource以及ES6语法,采用组件化思想搭建整个项目,从而使组件高度复用,代码十分简洁。 岗位职责:主要负责项目页面的布局和数据渲染,完成与后端的接口对接,配合后端的对接联调,解决不同浏览器或者不同手机端页面布局错乱的问题。 项目架构: 1.使用vue框架,以及vue-router构建单页面应用。 2.使用vue+webpack构建项目环境。 3.采用手机淘宝适配方案。 4.使用阿里矢量图标库。 技术要求: 1.项目采用node(express框架)+mysql来搭建后台服务器; 2.基于webpack来搭建项目工程,配置第三方插件; 3.使用vue框架,vue-router搭建项目路由,vuex来实现单文件组件和数据的抽离 4.使用Swiper实现首页banner的轮播切换,iscoll结合ajax实现上拉加载,下拉刷新 5.合理使用钩子函数,实现数据的监听、渲染页面、页面节点的实例化功能。
以上是前端工程師履歷中的專案經驗怎麼寫的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undress AI Tool
免費脫衣圖片

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

費馬大定理,即將被AI攻克?而整件事最有意義的地方在於,AI即將解決的費馬大定理,正是為了證明AI無用。曾經,數學屬於純粹的人類智力王國;如今,這片疆土正被先進的演算法所破解,所踐踏。圖片費馬大定理,是一個「臭名昭著」的謎題,在幾個世紀以來,一直困擾著數學家。它在1993年被證明,而現在,數學家們有一個偉大計畫:用電腦把證明過程重現。他們希望在這個版本的證明中,如果有任何邏輯上的錯誤,都可以由電腦檢查出來。專案網址:https://github.com/riccardobrasca/flt

PyCharm是一款功能強大的Python整合開發環境,提供了豐富的開發工具和環境配置,讓開發者更有效率地編寫和除錯程式碼。在使用PyCharm進行Python專案開發的過程中,有時候我們需要將專案打包成可執行的EXE文件,以便在沒有安裝Python環境的電腦上執行。本文將介紹如何使用PyCharm將專案轉換為可執行的EXE文件,同時給出具體的程式碼範例。首

簡單易懂的PyCharm專案打包方法分享隨著Python的流行,越來越多的開發者使用PyCharm作為Python開發的主要工具。 PyCharm是功能強大的整合開發環境,它提供了許多方便的功能來幫助我們提高開發效率。其中一個重要的功能就是專案的打包。本文將介紹如何在PyCharm中簡單易懂地打包項目,並提供具體的程式碼範例。為什麼要打包專案?在Python開發

標題:深入了解PyCharm:刪除專案的高效方式近年來,Python作為一種強大而靈活的程式語言,受到越來越多開發者的青睞。在Python專案的開發中,選擇一個高效的整合開發環境至關重要。 PyCharm作為一款功能強大的整合開發環境,為Python開發者提供了許多便利的功能和工具,其中包括快速、有效率地刪除專案目錄。以下將著重介紹如何使用PyCharm中的刪除

如何在iOS17中的iPhone上製作GroceryList在「提醒事項」應用程式中建立GroceryList非常簡單。你只需添加一個列表,然後用你的項目填充它。該應用程式會自動將您的商品分類,您甚至可以與您的伴侶或扁平夥伴合作,列出您需要從商店購買的東西。以下是執行此操作的完整步驟:步驟1:開啟iCloud提醒事項聽起來很奇怪,蘋果表示您需要啟用來自iCloud的提醒才能在iOS17上建立GroceryList。以下是它的步驟:前往iPhone上的「設定」應用,然後點擊[您的姓名]。接下來,選擇i

IDEA(IntelliJIDEA)是一款強大的整合開發環境,可協助開發人員快速且有效率地開發各種Java應用程式。在Java專案開發中,使用Maven作為專案管理工具能夠幫助我們更好地管理依賴函式庫、建置專案等。本文將詳細介紹如何在IDEA中建立一個Maven專案的基本步驟,同時提供具體的程式碼範例。步驟一:開啟IDEA並建立新專案開啟IntelliJIDEA

身為科技部落客,了不起比較喜歡各種折騰,之前給大家介紹過ChatGPT接入微信,釘釘和知識星球(如果沒看過的可以翻翻前面的文章),最近再看開源專案的時候,發現了一個ChatGPTWebUI專案。想著剛好之前沒有將ChatGPT接入WebUI,有了這個開源專案可以拿來使用,真是不錯,下面是實操的安裝步驟,分享給大家。安裝官方在Github的專案文件上提供了很多中的安裝方式,包括手動安裝,docker部署,以及遠端部署等方法,了不起在選擇部署方式的時候,一開始為了簡單想著

react啟動專案報錯的解決方法:1、進入專案資料夾,啟動專案並查看報錯資訊;2、執行「npm install」或「npm install react-scripts」指令;3、執行「npm install @ant-design/ pro-field --save」指令。
