Создать приложение-задачник.
Задачи состоят из:
- имени пользователя;
- е-mail;
- текста задачи;
- картинки;
Стартовая страница - список задач с возможностью сортировки по имени пользователя, email и статусу. Вывод задач нужно сделать страницами по 3 штуки (с пагинацией). Видеть список задач и создавать новые может любой посетитель без регистрации.
Перед сохранением новой задачи можно нажать "Предварительный просмотр", он должен работать без перезагрузки страницы. К задаче можно прикрепить картинку. Требования к изображениям - формат JPG/GIF/PNG, не более 320х240 пикселей. При попытке загрузить изображение большего размера, картинка должна быть пропорционально уменьшена до заданных размеров.
Сделайте вход для администратора (логин "admin", пароль "123"). Администратор имеет возможность редактировать текст задачи и поставить галочку о выполнении. Выполненные задачи в общем списке выводятся с соответствующей отметкой.
Фреймворки использовать нельзя. В приложении нужно с помощью чистого PHP реализовать модель MVC. Верстка на bootstrap. К дизайну особых требований нет, должно выглядеть аккуратно.
Результат нужно развернуть на любом бесплатном хостинге, (как пример - zzz.com.ua) чтобы можно было посмотреть его в действии. На github.com или bitbucket.org выкладывать не обязательно. Для того, чтобы мы могли проверить код, пожалуйста, скопируйте в корневую папку проекта наш онлайн-редактор dayside (https://github.com/boomyjee/dayside). Таким образом редактор будет доступен по url <ваш проект>/dayside/index.php. Нужно дать PHP доступ на исполнение и запись к папке dayside. Попробуйте открыть dayside сами - вы должны увидеть код своего приложения. При первом запуске редактор попросит установить пароль: пожалуйста, поставьте как в админке "123".
Обратите внимание, аккуратность - это один из главных критериев оценки тестового.
Задание рассчитано на один рабочий день. Если выйдет чуть дольше, но толково - тоже хорошо. Будем ждать от вас сообщение с результатом работы, как справитесь. Укажите, пожалуйста, в своём письме количество потраченного времени на работу с тестовым заданием.
В случае, если наше тестовое задание для вас оказалось слишком сложным (или вы не смогли выполнить его по другим причинам) пожалуйста, сообщите нам. Будем ждать вашего ответа в любом случае.
По окончанию выполнения ждем от вас две ссылки - на редактор dayside и на тестовое задание. Тест на интеллект не показывает результат, он виден нам во внутренней CRM. Если интересно, результат могу сообщить.
Author: WebDesign Master | Manual in Russian
OptimizedHTML is all-inclusive, optimized for Google PageSpeed start HTML5 template with Bootstrap (grid only), Gulp, Sass, Browsersync, Autoprefixer, Clean-CSS, Uglify, Imagemin, Vinyl-FTP and Bower (libs path) support. The template contains a .htaccess file with caching rules for web server.
OptimizedHTML Start Template uses the best practices of web development and optimized for Google PageSpeed.
Cross-browser compatibility: IE9+.
The template uses a Sass with Sass syntax and project structure with source code in the directory app/ and production folder dist/, that contains ready project with optimized HTML, CSS, JS and images.
- Download optimizedhtml-start-template from GitHub;
- Install Node Modules: npm i;
- Run the template: gulp.
- gulp: run default gulp task (sass, js, watch, browserSync) for web development;
- build: build project to dist folder (cleanup, image optimize, removing unnecessary files);
- deploy: project deployment on the server from dist folder via FTP;
- rsync: project deployment on the server from dist folder via RSYNC;
- clearcache: clear all gulp cache.
- All HTML files should have similar initial content as in app/index.html;
- Template Basic Images Start comment in app/index.html - all your custom template basic images (og:image for social networking, favicons for a variety of devices);
- Custom Browsers Color Start comment in app/index.html: set the color of the browser head on a variety of devices;
- Custom HTML comment in app/index.html - all your custom HTML;
- For installing new jQuery library, just run the command "bower i plugin-name" in the terminal. Libraries are automatically placed in the folder app/libs. Bower must be installed in the system (npm i -g bower). Then place all jQuery libraries paths in the 'libs' task (gulpfile.js);
- All custom JS located in app/js/common.js;
- All Sass vars placed in app/sass/_vars.sass;
- All Bootstrap media queries placed in app/sass/_media.sass;
- All jQuery libraries CSS styles placed in app/sass/_libs.sass;
- Rename ht.access to .htaccess before place it in your web server. This file contain rules for files caching on web server.