张新丁WEB前端工程师

前端,涉猎后端

4年工作经验

  • Javascript

    • 掌握熟练使用Ajax调用后台数据,使用jsonp方式解决ajax跨域问题;
    • 熟练使用fullPage,Bootstrap,Swiper等框架;
    • 掌握熟练使用Ajax调用后台数据,使用jsonp方式解决ajax跨域问题
  • HTML & CSS

    • 能使用合理的结构和样式编写兼容主流浏览器的页面;
    • 熟练PC端和移动端的响应式设计和开发;
    • 熟练掌握HTML5+CSS3等前端相关技术;
  • Vue.js

    • 能够使用VueJS框架进行项目组件的封装;
    • 使用vue-resourse进行异步数据请求;
    • 使用vue-route进行路由功能的处理等;
  • 微信公众平台、小程序

    • 熟练使用微信小程序组件和API的开发,并完成支付功能;
    • 熟练使用微信公众平台应用开发,并有微信发红包、微信sdk接口开发经验。
  • Krpano

    • 开发360°全景图片;
    • 全景视频;
    • WEB页面直播程序
  • PHP

    • 熟悉PHP+MYSQL数据库开发和ThinkPHP框架,并有实际网站开发经验;
    • 运用PHP语言,利用Ajax调用后台API接口,并在服务器中记录日志;
  • Photoshop

    • 熟练使用Phtoshop、Cutterman,并对设计图进行切割和导出;

曾在两家互联网公司任职

有大型网站开发、优化经验

现在

兹曼软件技术有限公司

WEB前端工程师

前端负责人,包括:

  • 基于krpano开发360°全景图片、全景视频、WEB页面直播程序;
  • 根据产品设计文档,利用HTML5相关技术开发跨平台的前端虚拟现实VR产品;
  • 熟练掌握基于WebGL的开发,基于krpano商业插件,ThreeJS框架完成360°全景开发;
  • 负责微信公众号平台的二次开发,如微信公众平台发红包功能、摇一摇、接口sdk的调用(运用PHP语言);
  • 负责微信小游戏前端页面的制作,及后台API接口的对接(运用PHP语言);
  • 根据公司产品功能需求,独立完成PC / 移动端 / 微信页面的开发;
  • 同期工作之余开始自学vueJS,并编写项目;
2016/3

北京市盛世阳光文化传播有限公司

WEB前端开发工程师/PHP

  • 使用HTML5 / CSS3来实现页面的开发工作,完成PC / 移动端项目;
  • 利用jQuery插件实现动画效果;
  • 通过JavaScript实现各类页面动态及交互效果;
  • 通过PHP语言进行网站后台开发(一年);
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

此外,还负责部分网站的后台开发。

2014/2

丰富的项目经验

业余项目与公司项目相互促进

兹曼软件技术官网【移动端+PC端】

  • krpano
  • HTML
  • CSS
  • Javascript

2016/11 至今2016/12

1. 兹曼软件公司是一家以技术驱动应用的公司,主要聚焦于VR采集设备及配套的 软件算法的研发;

2. 项目主要运用了krpano实现全景播放,JQuery来完成页面动 画和交互效果

  • 使用全景插件krpano,实现首页全景展示和多个全景视频的切换;
  • 使用JQuery实现网页动画和视差滚动效果;
  • 通过JS实现各类页面动态及交互效果;
  • 使用原生JS判断用户访问终端的类型;
  • 移动端则使用 zepto.fullpage实现单页滚动效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;
兹曼软件技术官网

小程序“兹曼软件”

  • 微信小程序

2017/6 至2017/7

1. 兹曼软件是通过“微信小程序”编写的一款微信商城项目,实现公司产品VR全景相机的购买;

2. 项目主要运用小程序组件和API的开发;

  • 利用组件实现页面的布局;
  • 通过调用API中wx.chooseLocation()获取到当前的地图位置;
  • 个人信息的修改中利用wx.setStorage()储存数据,通过getStorage()读取key的内容;
  • wx.chooseImage()实现用户头像更改;
  • 通过加速度计监听加速度数据实现微信摇一摇功能;
  • 完成购物车的全选、删除、数量的增减和价钱的计算;
  • 通过调用wx.requestPayment()实现微信支付功能;
小程序“兹曼软件”

刘金梅医疗美容诊所【移动端和PC端自适应】

  • HTML 5
  • CSS 3
  • Javascript
  • Bootstrap

2016/11 至今2016/12

刘金梅诊所是一家医疗整形美容机构。项目主要运用Bootstrap框架,实现PC端和移动端自适应,数据的统一

  • 使用Bootstrap的网格系统,实现整个页面的排版、表格、图像;
  • 调用Bootstrap布局组件,实现网站导航栏、下拉菜单、列表组功能;
  • 使用插件Carousel实现轮播图;
  • 使用Dropdown下拉菜单插件实现导航下拉功能;
刘金梅医疗美容诊所

中央音乐学院【PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

中央音乐学院继续教育学院是全国音乐人才向往的院校,项目中主要使用JQuery实现网站滑动特效、HTML5 / CSS3来实现页面布局;

  • 通过采用DIV+CSS样式布局排版;
  • 通过Javascript实现各类页面动态及交互效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

北京师范大学系统科学院【PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

北京师范大学系统科学院主要运用H5与CSS实现页面布局及JS实现选项卡和 菜单特效。

  • 通过采用DIV+CSS样式布局排版;
  • 通过Javascript实现各类页面动态及交互效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

北京师范大学教师教育【PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

北京师范大学教师教育主要运用H5与CSS实现页面布局及JS实现选项卡和 菜单特效。

  • 通过采用DIV+CSS样式布局排版;
  • 通过Javascript实现各类页面动态及交互效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

凤凰都市传媒【手机和PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

凤凰都市传媒主要是一家打造电视、互联网、平面、户外、广播的全媒体平台。项目主要运用JQ实现网站页面的动画效果,H5与CSS实现页面布局。

  • 使用JQuery实现网页动画效果和图片轮播旋转木马效果;
  • 通过Javascript实现各类页面动态及交互效果,及判断用户访问终端的类型;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

民生财富【手机和PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

民生财富是一家金融服务平台。该网站主要分为移动端与PC端,主要运用JS实现页面主要特效, H5与CSS实现页面布局

  • 使用JS实现焦点图鼠标滑动特效及交互效果;
  • 使用JQuery实现页面动画效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

民生信托【移动端+PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

该网站主要分为移动端与PC端,主要运用JS实现页面主要特效, H5与CSS实现页面布局

  • 使用JS实现焦点图鼠标滑动特效及交互效果;
  • 使用JQuery实现页面动画效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

民生保险经济【移动端+PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

该网站主要分为移动端与PC端,主要运用JS实现页面主要特效, H5与CSS实现页面布局

  • 使用JS实现焦点图鼠标滑动特效及交互效果;
  • 使用JQuery实现页面动画效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

民生控股【PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

该网站主要分为移动端与PC端,主要运用JS实现页面主要特效, H5与CSS实现页面布局

  • 使用JS实现焦点图鼠标滑动特效及交互效果;
  • 使用JQuery实现页面动画效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

华融信托【手机和PC端】

  • HTML 5
  • CSS 3
  • Javascript
  • JQuery

民生财富是一家金融企业。该网站主要分为移动端与PC端,主要运用JS实现页面主要特效, H5与CSS实现页面布局

  • 使用JS实现焦点图鼠标滑动特效及交互效果;
  • 使用JQuery实现页面动画效果;
  • 与产品、设计师、开发人员配合,根据需求调整、修改、优化页面;

恭王府捡钱游戏

  • HTML 5
  • CSS 3
  • Javascript
  • PHP

2017/6 至今

1. 恭王府捡钱游戏是一款,通过微信公众平台配置ibeacon设备,并部署在恭王府内,用户可通过微信摇一摇领取红包、优惠券等福利的小游戏;

2. 项目主要运用动画animate实现页面效果,微信公众平台开发、接口的调用;

  • 使用HTML5/CSS3来实现页面的开发工作;
  • 使用 animate实现页面的动画效果;
  • 利用Ajax技术实现了静态访问数据,提升数据交互体验;
  • 运用PHP语言,调用后台API接口,并在服务器中记录日志;
  • 通过PHP,调用微信商户平台下载API证书文件,实现微信发红包;
  • 通过调用微信公众平台SDK接口实现微信分享好友、朋友圈功能;
恭王府捡钱游戏

全景游戏-牡丹园寻宝

  • HTML 5
  • CSS 3
  • Javascript
  • PHP
  • krpano

2017/6 至2017/7

1. 牡丹园寻宝,是通过全景图片展览牡丹园景区,并同时寻找宝石的一款新型全景小游戏;

2. 项目主要运用krpano全景图片以及倒计时实现、API接口调用;

  • 运用Krapno插件,实现全景图片演示;xml中实现倒计时功能(开始与暂停)、成绩总数的计算以及全景场景模式的切换;
  • 利用Ajax技术实现静态访问数据,提升数据交互体验;
  • 通过PHP,调用后台API接口,并在服务器中记录日志;
  • 通过js实现倒计时,且读取xml文件中成绩个数,并累计计算;
牡丹园寻宝

对Web充满热情

学生时代就踏上了开发之路

2012年9月至2014年2月在河北软件学院就读,专业:软件技术,课余做了多个大型网站,其中

  • CSDN学院用户管理系统
  • 优质课程网