报名系统开发总结ASP.NET MVC

资料:前辈的源码、堆栈旁的猫的个人博客页面
工具:vs2015community\Sql Server 2012
简介:使用MVC4.0开发模式

先上演示图:

整体预览
滑动效果
动态图标提示

创建数据库

首先做好准备工作,主要目的是招新,所以就一张基本信息表就够了,见表也很简单,时间限制,我就直接借用前辈的数据库了。

着手项目

新建ASP.NET MVC项目

考虑到兼容性问题,因为我们最终要放到网站的服务器上,服务器上的VS版本较低,这样打开VS2015的项目就会遇到很多问题,最偷懒的解决办法就是,在服务器上创建项目框架,然后用自己的VS2015去打开,再去开发。

文件部署

文件清理

创建的项目模板中通常带有很多我们并不需要的东西,而这个招新网站本来也不会是特别大型的,所以相比之下,那些无用的很占空间,所以还是清理掉比较好。

添加必要的文件夹

  1. CSS:样式文件,放在Content文件夹中;
  2. JS:js脚本文件,放在Script文件夹中;
  3. Files:存放一些文档文件;
  4. images:存放Logo、上传存照等图片文件;
    样式文件、图片、一些文档,也就是1、3、4都放在Content文件夹中,JS放在Script文件夹中,做好分类规整会给后续开发带来很大帮助。

创建页面

我的招新网站主要分为下面几部分页面:

  1. 首页:对网站以及这次招新的要求做一个简要说明介绍,并提供报名入口进行简历填写。主要是前端界面设计,基本没有和后台的数据交流。
  2. 简历填写页面:简历的页面设计以及后台逻辑,涉及到将信息提交数据库,文件、照片上传下载。网上有很多求职网站中的填写简历界面都做得非常棒,而且给人感觉也不错,但毕竟不是开源,只能借鉴其页面设计,后台要怎么开发,我找到网站官网上一些功能,可以通过改造成简历填写的一部分,最重要的是有参考,本人还处在学习阶段,所以还是需要一些前辈经验来帮助自己的网站开发。
  3. 提示页面:在简历提交成功或失败,需要提供给用户一个提示页面,提交已成功或失败,这样可以带给用户更好的体验。
  4. 母版页:如果页面较多,或有重合内容,比如网站的标志、上方导航栏,下方版权提示一般都会是固定不变的,这就可以把他们做成母版页。

前端

具体实现的代码过程就不详述了,简单说下中间遇到的问题和解决办法,以及经验吧。
1.原本打算模仿大神堆栈旁的猫的博客页面,只用Html+CSS+js完成各种效果,无奈能力不够,招新时间都快到了,最后临时使用了jQuery->fullPage.js,实现在同一个页面,点击导航栏,定位到指定位置,原理是锚链接。<a href="#firstPage"></a> ,firstPage是指定div的ID,点击链接就会跳转到指定的div.
https://github.com/alvarotrigo/fullPage.js
这里有详细的fullPage.js的使用方法和注意事项。
2.在准备写一个网站的前端页面之前,一定要有一个整体的页面设计规划,对于各模块的摆放位置,都要提前有一个明确的设计,所以说,找一个美工设计的伙伴提前做好设计特别重要,自己设计也可以。我就因为没有提前做好规划设计,导致后来让美工设计的同学帮忙看一下,就遭到了吐槽,而且很多布局都有大改动,又加大了工程量。
3.适配手机:当然也可以不用适配,直接按在电脑上的样子显示,不过因为我做的这个页面是通过锚链接定位到四个页面,也相当于四个屏幕,如果不进行适配,就达不到理想效果。手机适配也不难,就是可能麻烦了点,因为各个手机尺寸都不一样,强烈建议使用百分比。手机屏幕有限,所以尽可能的就是要把无用信息和效果进行删减。
上图:

手机端适配预览

后台( ASP.NET C# )

主要涉及到的功能点有提交简历信息插入数据库、上传文件、后台查看简历列表以及建立详细信息。
这个网站的完成比较匆忙,仅仅完善了用户能看到的页面,后台管理员查看简历没有很好的进行完善,招新已经过去很久了,直到今天才腾出来点时间完成这篇未完成的文章。也无暇在对每一个步骤进行详细的回忆和描述,如果有朋友对哪一个部分感兴趣或者有疑问可以留下评论或私信,欢迎哦!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,911评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,014评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 142,129评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,283评论 1 264
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,159评论 4 357
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,161评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,565评论 3 382
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,251评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,531评论 1 292
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,619评论 2 310
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,383评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,255评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,624评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,916评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,199评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,553评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,756评论 2 335

推荐阅读更多精彩内容