求助 编程测试题 web front end

匿名人士

小弟最近应聘了一个junior web developer的职位，以前平时给网站更新，加功能什么的都没有问题。可是一看测试题就傻眼了，根本没有接触过，好抽象的感觉。可能小弟太业余，哪位高手指点一下，死也要死的甘心。

Visit: http://jsonplaceholder.typicode.com/ and write an (Android, iOS, or AngularJS) application that:

-Shows a list of album titles returned by http://jsonplaceholder.typicode.com/albums with the name of the user the album belongs to.

-When an album is clicked, show its photos returned by http://jsonplaceholder.typicode.com/photos as thumbnails.

-When a thumbnail is clicked, the full sized photo should be displayed.



Only data that will be presented should be loaded.

It should be possible to start the application.

You may use the documentation of the endpoints:

http://jsonplaceholder.typicode.com/


这个东西能用Jquery写吗？

Alantod17

这个 关键看你会不会Android Ios 和angular了~~~
那两个链接里面都是JSON

其实这个还挺tricky的 关键还要考你UX设计~~~不单单是功能实现~~~

liuruihua

最普通的应用啦

让你junior web developer写android, ios是不对的，因为你不会啦
会AngularJS的应该不是junior web developer，我有21年编程经验，这三个应用天天都在写

Alantod17

liuruihua 发表于 2015-9-2 11:01
最普通的应用啦

让你junior web developer写android, ios是不对的，因为你不会啦

21年……前辈……

匿名人士

Alantod17 发表于 2015-9-2 10:57
这个 关键看你会不会Android Ios 和angular了~~~
那两个链接里面都是JSON

我去应聘web developer为什么要考我android 和ios，觉得有点奇怪。后面那个Angular更是以前都没听说过。

Github 也没有用过，看样子我比junior还差了很远，是baby的水平啊

御将通佑

web 实现的话 主要就是用 jquery + json

功能很容易实现，就像楼上说的，UI 设计很重要。

Deardevil

匿名人士 发表于 2015-9-2 11:04
我去应聘web developer为什么要考我android 和ios，觉得有点奇怪。后面那个Angular更是以前都没听说过。
...

为什么web developer要考那些？是做web的不是做applications的啊。我也是个junior web developer， 只认识这几个名字，不懂写的是什么

liuruihua

匿名人士 发表于 2015-9-2 11:04
我去应聘web developer为什么要考我android 和ios，觉得有点奇怪。后面那个Angular更是以前都没听说过。
...

AngularJs就是可以大幅度减少写代码啦和jquery比，如果你会用jquery,web developer也是可以做的啦，因为毕竟AngularJs还是很新啦，另外你不用担心，AngularJs新版本不支持老版本，所以大家都在一条水平线上

上面的题目用jquery也是可以做的吗，就是写一个网站调用json call

Alantod17

匿名人士 发表于 2015-9-2 11:04
我去应聘web developer为什么要考我android 和ios，觉得有点奇怪。后面那个Angular更是以前都没听说过。
...

你是刚毕业吗？ Angular JS 这种东西 学校貌似没有教的 不过这个用在现代web app上很多~~比起传统网页有很多优势~~要求 只是让你3个里面选一个~~~去看看Angular吧 学一下对以后也好~~不过马上要2.0了~~貌似是breaking change~~

Alantod17

liuruihua 发表于 2015-9-2 11:10
AngularJs就是可以大幅度减少写代码啦和jquery比，如果你会用jquery,web developer也是可以做的啦，因为 ...

你这对Angular的定义也太……angular和Jquery解决的不是一个问题~~~~

dulowa0228

难道是lancom的测试题？

liuruihua

Alantod17 发表于 2015-9-2 11:14
你这对Angular的定义也太……angular和Jquery解决的不是一个问题~~~~

angularjs是重新将controller嵌入html代码里，当然实际javascript仍然可以单独分开为javascript文件啦，我不太喜欢angularjs，因为用angularjs写程序太简单啦，很容易被人破解网站啦

用jquery多好，用了混淆后，基本上看不出个所以然

匿名人士

liuruihua 发表于 2015-9-2 11:01
最普通的应用啦

让你junior web developer写android, ios是不对的，因为你不会啦

大神，能写个样板吗？就是第一个功能，我不明白怎么写application ?

应该就是一个html页面吧？我不懂json，是不是图片的所有信息都存在json数据库里了？

匿名人士

御将通佑 发表于 2015-9-2 11:07
web 实现的话 主要就是用 jquery + json

功能很容易实现，就像楼上说的，UI 设计很重要。 ...

说实话，真不懂，怎么还有UI了？

是不是建立个html页面实现就可以了，能示范一下吗？多谢了

剪刀石头布

给lz跪了，图片信息在这里http://jsonplaceholder.typicode.com/photos
你用jquery get把这些数据提出来： http://api.jquery.com/jquery.getjson/
只能帮到这里了。

liuruihua

匿名人士 发表于 2015-9-2 11:27
大神，能写个样板吗？就是第一个功能，我不明白怎么写application ?

应该就是一个html页面吧？我不懂jso ...

看这个啦
http://www.w3schools.com/angular/angular_http.asp

liuruihua

匿名人士 发表于 2015-9-2 11:28
说实话，真不懂，怎么还有UI了？

是不是建立个html页面实现就可以了，能示范一下吗？多谢了 ...

       是的啦

liuruihua

剪刀石头布 发表于 2015-9-2 11:29
给lz跪了，图片信息在这里http://jsonplaceholder.typicode.com/photos
你用jquery get把这些数据提出来：  ...

你说的正确啦

MJC

楼主你提到的给网站更新，加功能什么的没问题，是因为你用的都是现成的网站，已经搭建好的，对吗？
所以我感觉现在让你从头写，不知道从何下手？

对于这个测试，android和IOS先放放，现学的话，时间可能不够。

提到了angular,那就去看看angular的教程，应该可以速成。
可以多看一些现成的例子，把类似的功能用到你这上面。

建议:
1. 如果用angular的话，写的时候尽量避免再使用jquery.
以下应该会让你更出众点我觉得： (可能超出了junior范围，但都是现在比较流行的)
2. 使用些前端自动化的工具,npm, bower, gulp/grunt etc..
3. 写unit test.
4. 用es6写
5. 可以用些流行的css framrwork，比如bootstrap, foundation。

liuruihua

MJC 发表于 2015-9-2 11:41
楼主你提到的给网站更新，加功能什么的没问题，是因为你用的都是现成的网站，已经搭建好的，对吗？
所以我 ...

你这不是要人命吗？

一个不会走路的孩子，你竟然要他去跑
另外framrwork好像不是这样拼的吗？:-)

Alantod17

liuruihua 发表于 2015-9-2 11:22
angularjs是重新将controller嵌入html代码里，当然实际javascript仍然可以单独分开为javascript文件啦， ...

不知道你做这行多久了 angular 是MVVM框架 一方面可以减少读取 一方面可以分开逻辑测和界面层~~至于说是容易被别人破~~看你的意思是说angular的代买太容易读 所以比较容易破？JQuery 可以看不出所以然？ 你production的时候前段代码不compile吗？

liuruihua

Alantod17 发表于 2015-9-2 11:50
不知道你做这行多久了 angular 是MVVM框架 一方面可以减少读取 一方面可以分开逻辑测和界面层~~至于说是 ...

看不懂你说compile的意思？你指的是minify, obfuscate javascript?

Alantod17

liuruihua 发表于 2015-9-2 11:54
看不懂你说compile的意思？你指的是minify, obfuscate javascript?

是的 就和楼上说的一样 通常都会Glup~~~

liuruihua

Alantod17 发表于 2015-9-2 11:56
是的 就和楼上说的一样 通常都会Glup~~~

minify, obfuscate的代码可以用beautifier来读的呀，简单代码这样可以直接看出逻辑

gulp只不过是build系统呀，和使代码难读有啥关系？我写的网站都用gulp来build的

liuruihua

Alantod17 发表于 2015-9-2 11:50
不知道你做这行多久了 angular 是MVVM框架 一方面可以减少读取 一方面可以分开逻辑测和界面层~~至于说是 ...

我做这行21年啦，最早是写java用j2ee的用apache ant来build的

Alantod17

liuruihua 发表于 2015-9-2 12:00
minify, obfuscate的代码可以用beautifier来读的呀，简单代码这样可以直接看出逻辑

gulp只不过是build系 ...

好吧 只是comment了一下 说angular 容易读所以有漏洞~~~~我只是不懂 相对于Jquery， anjular在易读性上有什么劣势~~

liuruihua

Alantod17 发表于 2015-9-2 12:10
好吧 只是comment了一下 说angular 容易读所以有漏洞~~~~我只是不懂 相对于Jquery， anjular在易读性上有 ...

其实纯粹技术讨论啦，共同学习 :-)

我用jquery写的网站，现有代码大概八千行，用angularjs写的网站大概几百行，当然两网站的功能完全不一样，只不过都是麻雀虽小，五脏俱全啦，我是比较关心网站不被人破解的，所以代码在minify, obfuscate后，我要用firefox, chrome看下javascript是否可读，以免网站逻辑被人分析啦，当然是代码越多，读起来越烦，就会迫使阅读的人放弃阅读啦
我知道加密，解密是一对矛盾，我所做的其实是无效的，但我每做一步，都会增加一点难度啦，直到被认为阅读网站的javascript的代码不值得为止

angelvan2012

真是很有价值的帖子，充满了技术点。

另外膜拜21年兄

Alantod17

liuruihua 发表于 2015-9-2 12:17
其实纯粹技术讨论啦，共同学习 :-)

我用jquery写的网站，现有代码大概八千行，用angularjs写的网站大概几 ...

好吧 我只能说我自己不能同意这观点 没想到不用framework的理由是因为代码会变得容易理解~~~也许是我涉世未深~~~~

匿名人士

小弟照葫芦画瓢写了一个不工作啊，哪里有问题？


<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Angular test</title>

    <script src="hhttp://ajax.googleapis.com/ajax/ ... 3.14/angular.min.js"></script>
   
</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">

<ul>
          <li ng-repeat="photo in photos | orderBy:id">
            <a href="http://jsonplaceholder.typicode.com/photos/{{photo.url}}" class="thumb"><img ng-src="http://jsonplaceholder.typicode.com/photos/{{photo.thumbnailUrl}}"></a>
            <a href="http://jsonplaceholder.typicode.com/photos/{{photo.url}}">{{photo.title}}</a>
            
          </li>
        </ul>

</div>
        
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $http.get("http://jsonplaceholder.typicode.com/photos")
  .success(function (response) {$scope.data = response.data;});
});
</script>

</body>
</html>