Как сделать сайт программы

Опытные разработчики могут не читать дальше, так-как эта статья рассчитана скорее на новичков, но всё-же я был бы очень рад, если бы кто-нибудь оставил конструктивную критику в мой адрес или указал на ошибки.

В этой статье я бы хотел рассказать начинающим разработчикам, как можно с минимальными усилиями создать свою веб-платформу начального уровня.

В статье я расскажу, как практически с нуля можно, даже не владея огромным стеком технологий, развернуть на удаленном облаке свой собственный уютненький ресурс. Это может быть ваш личный блог, какой-то интересный сервис или просто ресурс о котором вы давно мечтаете. Что может быть приятнее, чем отправить другу ссылку на свой собственный ресурс и вместе обсудить какие-то интересные моменты или просто посмеяться.

Для предпринимателей или начинающих бизнесменов, или владельцев каких-либо площадок будет интересно узнать, что им в начале их бизнеса совсем не обязательно вкладывать большие деньги на «крутой» сайт, а достаточно воспользоваться открытыми библиотеками и единственное за что заплатить — это за то, чтобы взять в аренду виртуальный сервер.

САЙТ-ПОРТФОЛИО НА TILDA // Делаем шикарное портфолио за 15 минут

В статье я покажу, как сделать простейший сайт, имеющий простую функциональность. Это скорее статья, посвященная именно тому, чтобы показать общую концепцию и помочь начинающим разработчикам сформировать понимание того, как именно создаются такие известные ресурсы, как Google, Facebook, Вконтакте.

Вы должны понимать, что все интернет-сервисы создаются по одному принципу, отличаются только детали и реализация каких-то уникальных и конкретных вещей, но суть остаётся единой.

Для тех, кто заинтересовался:

Подготовка

Установка того, что нам понадобиться:

Писать наш сервис мы будем на Java, как самом распространённом языке для веб-сервисов.

Проверьте, что на вашем компьютере установлена последняя версия Java, сейчас это 8 версия. Проверить это можно здесь проверить Java. В 97% случаях так оно и есть, но если это не так, то следуя инструкциями на этом сайте вы без труда исправите это, установив и настроив окружение.

Если же всё-таки это не удалось, сразу договоримся с вами так, первым делом вы пытаетесь решить проблему на этих сайтах:

• www.google.ru
• toster.ru
• stackoverflow.com
• ru.stackoverflow.com

Вообще, открою вам секрет, в программировании, когда у вас всё заработало с 1 раза — это означает только одно, что что-то не работает. Это неоспоримый факт. Куча ошибок, несовместимость версий, отсутствие в библиотеке классов и прочее — это нормальное явление.

Ваш покорный слуга сам просидел 3 недели с ошибкой, облазив такие закоулки интернета, что на какое-то время потерял связь с реальностью и пролежал несколько месяцев в психиатрической больнице, но не будем об этом… Это история для отдельной статьи.

Итак, Java стоит — всё хорошо.

Теперь нам нужен инструмент. Да, нам нужна идея. Качаем и ставим отсюда JetBrains.

Как создать сайт такси на конструкторе сайтов

Только учтите, что вам нужна именно Ultimate — версия. Простая версия не позволяет разрабатывать веб-приложения. Там есть бесплатный пробный период на 30 дней, думаю с этим не будет проблем.

Итак, среда разработки есть, Java есть.

Начнём

В своё время я перечитал кучу статей и прочего, и решил, что в этой статье я исключу по максимуму картинки и визуальную составляющую, обычно она только отвлекает, у меня может быть другая версия, другой порядок модулей и прочее.

Часто вижу вопросы от новичков про такие интересные вещи, как Spring и Hibernate (https://spring.io/, hibernate.org). В 96% случаях вам это пока что не надо, и без хорошей подготовки и хорошего скилла «solve problem» вы увязните там очень надолго и выбраться обратно будет очень тяжело.

Ваша альма-матер на первых порах — это 2 технологии:

• Сервлет
• JDBC

«Application server». Что это такое? А вот, что Application server.

Так, нам нужен этот сервер, будем использовать Tomcat . Качаем его, если скачали то, что надо, а скорее всего скачали какую-нибудь фигню, то проверьте, архив должен называться «apache-tomcat-7.0.67.zip», разархивируем. Не забудьте, куда распаковали, пригодиться он вам ещё.

Концепция веб-ресурсов

Суть такая, сервер. Что такое сервер? Это программный код, который «зацикленно» крутиться в системе и слушает порты. Это тема отдельного разговора. Но в общем, рассмотрим 2 варианта того, что вообще сервер умеет делать, он умеет отдать данные (GET) — просто вернуть число, страницу, или ещё бог знает что.

Но, есть ещё и POST — он тоже возвращает данные, но и принимает от клиента их перед этим.

Если ничего не понятно, читаем тут ru.wikipedia.org/wiki/REST.

Статья начинает слишком сильно расти. Теперь буду стараться писать более кратко.

Идём в мой репозиторий. Предполагаем, что человек совершенно не понимает, что такое система контроля версий, поэтому идём путём дилетанта, там есть кнопка («Download ZIP» — качаем и разархивируем).

В окне приветствия идеи есть кнопка «import project» — жмём. Выбираем скачанный и разархивированный проект.

Жмём далее, далее и далее, пока не откроется проект.

Первые сложности

Проект открыт, но вы не запустите сервер и не сможете открыть сайт. Почему? Потому что, идея не знает, что ей делать, она умна, но не настолько.

Объяснение того, как это сделать, заняло бы пару страниц и оказало бы вам «медвежью» услугу. Первые сложности — первые трудности. Это будет вашим «боевым крещением». Программировать — не пирожки печь. Ссылки сверху вам помогут.

Потратить 1-2 часа на это — это нормально. Я знаю хороших и опытных программистов, которые сидели несколько дней, но так и не сумели правильно запустить сервер. Это не делает им чести — но факт — есть факт. Вперед. Запустите — возвращайтесь к чтению.

Не забудьте сообщить идее, что используем tomcat (как? ссылки вверху, по ним есть ответ).

Локальное тестирование сервиса

Получиться у вас должно примерно вот это:

Но есть проблема — не работает! Ну что же, этого следовало ожидать. У нас не создана таблица в базе данных. В проекте мы используем базу данных SQLite

Объяснить, что это такое будет с 0 не просто. Попробуйте почитать об этом на специализированных ресурсах.

Могу посоветовать хороший сервис: www.codecademy.com (там есть Java, SQL, Git, JavaScript и другие супер полезные вещи), поэтому милости прошу.

В итоге, нам нужно создать нашу таблицу, делаем это так:

cd Path/apache-tomcat-7.0.64/bin/ sqlite3 SimpleDatabse
CREATE TABLE NAMES( ID INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL, NAME TEXT NOT NULL );

Таблица создана. Можно проверить как работает наша система. Добавьте пару имён и посмотрите, как они будут вам возвращены уже из самой базы.

Разбор кода

Начнём смотреть, что же у нас в коде:

Так уж повелось, что в Java все конфигурации пишутся в xml-файлах, тут не исключение — файл web.xml контролирует, то, какой сервлет за что отвечает. Внимательно посмотрите на код и попробуйте поменять ссылку или имя сервлета.

Приложение у нас простое, поэтому у всего 2 класса (SQLiteClass и MainServlet).

Очевидно, думаю, что первый отвечает за работу с базой данных, а второй и есть наш пресловутый сервлет.

А вот и наши, упомянутые выше POST и GET запросы, эти функции являются обработчиками и задают поведение сервлета в ответ на запросы от клиента. Суть одна — данные пришли, данные ушли. Ничего сложного. Попробуйте поиграться с методами.

protected void doGet(HttpServletRequest request, HttpServletResponse response)
protected void doPost(HttpServletRequest request, HttpServletResponse response)

Переходим к классу, реализующему JDBC:

public static void addName(String name)
public static ArrayList getAllNames()

Здесь тоже всё просто, те же SQL запросы, только завёрнутые в Java-код. Небольшой совет — остерегайтесь всяких надстроек и фреймворков. Они хороши только в больших проектах, когда у вас миллионы записей, и сложные транзакционные операции.

Но, настоящий контроль вы получите только, когда пишете именно вручную запрос, без таких вещей как сериализация жить намного проще (особенно поначалу).

Всё, с серверной частью закончим. Тут вам придётся посидеть, почитать специальные статьи и руководства. Без реальной практики тут никак.

Клиентская часть

Вот и пришло время взглянуть на то, что твориться у клиента в браузере. А ничего сверхъестественного. Но, скажу вам прямо, конечно всё зависит от проекта, но, клиентская часть обычно намного сложнее в реализации, чем серверная. И всё в основном из-за JavaScript-а. Очень быстро клиентский код превращается в набор «простыней», заплат, хардкода и прочих веселостей.

JavaScript суров и беспощаден. На чистом нём писать очень тяжело. Поэтому мы используем JQuery. Есть куча других фреймворков и другого творения, но их касаться здесь не будем. Есть такая поговорка, что назови любое слово и это будет названием JS-фреймворка.

Известен в узких кругах фреймфорк Mocha, я не представляю какие мысли посещали человека, когда он придумывал ему название, ну ладно, это было его право, конечно же.

Итак, что у нас там с клиентом?

Опять дам ссылку на отличнейший ресурс www.codecademy.com. Фронтенд там разобран очень хорошо и даёт необходимую базу для начинающих.

Тут рассмотрим только функцию

function serverConnectFunc(serverUrl, jsonData) < $.ajax(< url: serverUrl + «/», type: ‘POST’, data: jsonData, dataType: ‘json’, async: true, success: function (event) < //do somehting >, error: function (xhr, status, error) < alert(error); >>); >

Что она делает? Правильно, шлёт тот самый POST — запрос и разбирает ответ. Всё просто, отдал данные и получил с сервера. По русски он говорит серверу «Дай мне имена всех, кто у тебя в базе» или «Занеси в базу это имя» и даёт ему имя.

Вот и вся клиентская часть.

Отправляем ресурс в настоящий мир

Как можно было заметить, наш сервис крутиться на локальном хосте. Другими словами на нашем же компьютере. Пришло время это исправить.

Тут я опишу лишь общий принцип сего действия. Это так или иначе потребует от вас денег на сервер, поэтому маловероятно, что кто-то действительно этим будет заниматься, особенно в самом начале своего программистского пути. Но понимать общую концепцию вы должны уже сейчас. Если кто решиться — знайте вы молодцы, вполне вероятно из вас может выйти толк.

И по традиции сразу несколько ссылок:

Читаем, что там написано, формируем в голове общую концепцию, того, как происходит взаимодействие программиста и удаленного сервера.

Сами сервера можно приобрести на amazone. Ссылку не даю, ибо реклама, можете сами поискать, это не сложно. Есть бесплатный тестовый период. НО! Будьте предельно осторожны, ваш покорный слуга сам слышал истории, как со счетов списывались тысячи долларов без ведома хозяина, ибо система сама умеет докупать себе мощности.

Не попадитесь, я сам уже платил несколько раз за непонятные услуги, там всё на английском. Если не уверены, что делаете — лучше вообще не делайте.

Порядок действий таков:

1. Арендуете облако
2. Подключаетесь по протоколу ssh
3. Ставите нужные пакеты и настраиваете систему
4. Собираете у себя war-пакет и деплоите его на сервер
5. Решаете кучу ошибок и проблем

На всякий случай я оставлю тут эти ссылки, вдруг, кто-то застопорился на каком-то моменте и решил спуститься в самый низ статьи, может помогут:

Заключение

Вот мы и добрались до кульминации нашего здесь обсуждения Джавы и веб-разработки на ней. Сложно? Да. Интересно? Да. Все, абсолютно все сервисы, будь то, поисковая система с миллиардами индексов, будь то видео-сервис с миллионами стрим-каналов — всё строиться по одному принципу. Отдать — забрать данные.

Понимая эту концепцию вы сможете написать любую систему, сервис или платформу.

Я не стану лукавить и обманывать вас уважаемые читатели. Вряд ли вы за 2 или 3 недели станете супер профессионалами и будете свободно писать код. Этому можно научиться только потом и долгими ночами. Чем дальше вы будете залазить в дебри, тем больше вы будете понимать, что вы так мало знаете. Дорогу осилит идущий, вперед, дерзайте.

Вперед. Пришло время действовать. Стареющим Дурову и Брину пора уйти на покой, время их славы уже прошло, пришло время обновить учебники истории и списки Forbs. И кто знает, может эту статью читает тот, кто в своё время напишет отличнейшую платформу, которая затмит собой таких гигантов как Google, Facebook и других. Удачи, спасибо, что дочитали до конца.

• Разработка веб-сайтов
• Программирование
• Java

Источник: habr.com

Как сделать сайт на PHP

В этой статье мы поговорим о том, как сделать сайт на PHP самостоятельно. А начнем мы с того, что Вам необходимо:

• Какие-то базовые знания HTML (см. уроки html)
• Какие-то базовые знания CSS (см. уроки css)
• Базовые знания PHP (см. уроки PHP)
• Программа интерпретатор PHP на компьютере или же хостинг с поддержкой PHP

Для решения третьей проблемы хорошо подойдет программа Denwer, которую можно бесплатно установить на Ваш компьютер. Если Вы не в курсе, что это за программа, то советую ознакомиться: как установить Denwer, в этой статье пошагово (для новичков) объяснено как его установить и как пользоваться.

Конечно, есть и другие средства, которые позволяют интерпретировать PHP. Например, Apatch, но он довольно сложен в настройках, а если вы новичок, то начинать с него не советую.

Для того, чтобы приступать к разработке сайта на PHP, Вам нужны начальные знания в HTML. Я уже писал о том, как создать простую страницу HTML. Там описаны все html-теги, без которых создать сайт невозможно. Поэтому настоятельно рекомендую начать изучать сайтостроение с той статьи.

Чем отличается сайт на PHP от голого сайта на HTML?

Сайт на PHP почти ничем не отличается от голого сайта на HTML. Единственное отличие — более гибкая настройка и управление сайта, а также есть возможность автоматизировать множество функций. Приведу простой пример.

Допустим в шапке сайта необходимо изменить буквально одно слово. Если сайт сделан на голом HTML, то необходимо будет открыть каждый html-файл, чтобы внести изменение, а это очень неудобно. Если же шапка сайта сделана на PHP в качестве подключаемого компонента, то изменения нужно будет внести только в одном файле и они автоматом изменятся на всем сайте.

Структура типичного сайта на PHP:

Теперь приведу код шаблона сайта на PHP. Обратите внимание на то, что страницы сделанные с использованием php рекомендуется делать с расширением .php , хотя это не является обязательным условием. При определенных настройках хостинга файлы с обычным расширением .html также могут обрабатывать PHP-код.

Код файла index.php :

html> head> title>Название страницыtitle> . php require_once $_SERVER[‘DOCUMENT_ROOT’].’/head.php’; ?> . head> body> . div class value»>shapka»> php require_once $_SERVER[‘DOCUMENT_ROOT’].’/top.php’; ?> div> . div class value»>page»> div class value»>sidebar_left»> php require_once $_SERVER[‘DOCUMENT_ROOT’].’/sidebar1.php’; ?> div> . div class value»>content»> . Основная часть сайта. div> . div class value»>sidebar_right»> php require_once $_SERVER[‘DOCUMENT_ROOT’].’/sidebar2.php’; ?> div> . div class value»>footer»> php require_once $_SERVER[‘DOCUMENT_ROOT’].’/footer.php’; ?> div> . div> body> html>

Теперь отдельно рассмотрим каждый из подключаемых элементов:

• head.php
• top.php
• sidebar1.php
• sidebar2.php
• footer.php

Обратите внимание, что подключается они через специальную команду PHP:

require_once

Каждый файл соответственно отвечает за отдельную часть сайта. Я постарался назвать их максимально информативно и понятно. Сайт может состоять из большего множество таких подключаемых файлов. Рассмотрим по порядку каждый элемент сверху вниз.

1. Файл head.php . Сюда я бы рекомендовал прописать всю мета информацию, которая дублируется (см. заголовочные теги) на каждой странице сайта. Например, сюда я советую включить как минимум подключаемые стили, favicon и скрипты. Эта информация дублируется на каждой странице, поэтому логично прописать это все в один файл. Код файла head.php :

. link rel value»>stylesheet» type value»>text/css» href value»>/style.css»/> link rel value»>shortcut icon» href value»>/images/favicon.ico» /> script type=’text/javascript’ src=’/javafile.js’>script> .

2. Файл top.php — это шапка сайта. Сюда обычно включают лого сайта, контактную информацию, рекламу и прочее. Зачастую код файла top.php является следующим:

. div class value»>logo»> img src value»>/logo.jpg»> Название сайата div> div class value»>contact»> Какая-то контактная информация div> div class value»>top_reklama»> Место для рекламы div> .

3. Файл sidebar1.php — левая колонка сайта. Очевидно, что сюда чаще всего размещают меню сайта (см. как сделать меню на PHP), ссылки на полезную информацию, рекламу и прочие ссылки. Зачастую код файла sidebar1.php является примерно следующим:

. div class value»>menu»> . Меню . div> div class value»>link_interes»> . Ссылки на интересные материалы . div> div class value»>reklama_sidebar1″> . Какая-то реклама . div> .

4. Файл sidebar2.php — это правая колонка нашего сайта. Сюда можно было бы разместить меню, но справой стороны его делают редко. Сюда размещают метки сайта, популярные записи, какую-то полезную информацию для пользователей. Зачастую код файла sidebar2.php является следующим:

. div class value»>metki»> . Метки . div> div class value»>popular»> . Ссылки на популярные материалы . div> .

5. Файл footer.php — это нижняя часть сайта. Чаще всего она полностью повторяется на каждой странице сайта, как и шапка. Сюда можно вписать ссылки на основные разделы сайта, поставить счетчики и написать ещё раз контакты. Зачастую код файла footer.php является следующим:

. div class value»>footer_menu»> . Ссылки на главные разделы . div> div class value»>counter»> . Коды счетчиков . div> div class value»>footer_contact»> . Ещё раз контакты . div> .

Вот так примерно выглядит самый простой сайт сделанный на PHP. Как я уже писал, подключаемых блоков может быть сколь угодно много. Рассмотренный пример не содержит базу данных. Это самый простой сайт на PHP, который можно назвать модифицированной версией html-сайта.

Источник: zarabotat-na-sajte.ru

Как создать сайт за 3 часа

Моя основная тема — продвижение, а не создание сайтов.

Но я делала много сайтов себе, а до этого у меня была студия веб-дизайна, и я хорошо знаю, как может растянуться на годы создание сайта.

И как создать сайт за 3 часа я тоже знаю.

Эта статья о том, как быстро сделать сайт на бесплатном движке WordPress, как это сделать красиво и бесплатно, чтобы сайт был адаптивным под мобильные телефоны, планшеты, чтобы он был SEO-friendly, то есть, чтобы его благоприятно восприняли поисковые системы. Пишу подробно, с указанием основных технических нюансов.

Речь идет на создании любого сайта (не обязательно блога) именно на WordPress, т.к. это одна из самых простых и интенсивно развивающихся бесплатных платформ. У меня все мои сайты на нем. Есть у него и плюсы, есть и некоторые минусы, хотя минусы скорее распространяются на масштабирование сайта и зависят от того, насколько грамотно изначально сформировать базу данных сайта. Если вы планируете огромный сайт на Вордпресс — стоит нанять специалиста этого направления.

Часто задача запустить даже простой сайт вгоняет людей в ступор и выпуск сайта откладывается на месяцы, если не на годы.

Очень часто все портит желание перфекциониста запустить сразу красивый и максимально удобный сайт. Со мной это происходило кучу раз, все эти ловушки хорошо известны. Поэтому теперь чаще всего (если только не нужен хороший лендинг-пейдж), я вполне могу создать сайт за 3 часа и начать с ним работать.

Дизайн, юзабилити и прочее будут дорабатываться потом в ходе дела. Самое главное — когда возникла идея, дать ей ход в 72 часа. Сайт будет «отстаиваться» — набирать возраст, траст, ссылочную массу, контент. Даже если я потом захочу переделать дизайн, он уже будет иметь сотни посетителей, топовые позиции, и принесет большую пользу.

Указанное время — 3 часа — не включает в себя временные затраты на поиск исполнителя на фрилансе (у меня уже есть такой проверенный специалист), если вы сами не разбираетесь в HTML или там привязке домена, не умеете регистрировать хостинг и т.д.

Я могу за пять минут на уже давно существующих эккаунтах создать домен, привязать к хостингу. Могу также моментально установить на хостинг Вордпресс (на некоторых хостингах типа Masterhost, Keyweb) есть автоматическая установка любых популярных движков. Могу разобраться с почти любой темой и еще могу покопаться в HTML-коде и кое-что по мелочам подпрвить.

Но для перевода шаблонов и разных других более сложных вещей (в частности, грамотно поставить плагин так, чтобы у меток и рубрик тоже были свои собственные Title, Meta Description, описание) я нанимаю специалиста на фрилансе. Это не дорого и гораздо грамотнее и быстрее.

Вы же можете спокойно нанять специалиста за 1-2 тысячи рублей и он вам все это сделает. О том, как безопасно и эффективно нанимать фрилансеров, я писала несколько советов тут.

У меня, чтобы создать сайт, в очень спокойном режиме ушло 3 дня (по несколько часов в день) на это все, включая наполнение сайта 15 постами (вместе с их написанием). У новичка, конечно, это растянется на неделю, но все равно — гораздо быстрее и дешевле, чем целиком заказывать у фрилансера, что может растянуться на годы.

1 день — выбрала шаблон, поставила домен, хостинг, вордпресс, тему. (1.5 часа)
2 день — потестировала тему, забила примерным контентом и написала большой список поправок техническому специалисту (1.5 часа)
3 день — наполняла контентом, правили оставшиеся мелочи вместе с тех. специалистом. (дополнительное время, когда сайт уже готов)

Но, конечно, это занимало у меня не весь день и если бы это был срочный проект, и мы бы с тех специалистом были оперативно на связи, пока он работал, мы бы справились со всеми делами за 3 часа.

Смотрите все основные шаги этого процесса. Их 12.

Итак, как создать сайт за 3 часа:

1. Придумать домен для сайта.

Для этого иду на nic.ru. У них есть еще удобный сервис подбора доменных имен.

Я обычно беру домен в зоне .ru. Как-то пыталась регистрировать еще и .рф. И как-то не понравилось.

2. Зарегистрировать выбранный свободный домен

Тут есть 2 основных варианта — сделать это отдельно на сайте главного регистратора типа nic.ru подороже или на сайте любого из перекупщиков типа 2domains.ru. И прописать там DNS вашего хостинг-провайдера.
Либо сразу покупать домен через хостинг-провайдера. Но не известно, что будет, если фирма хостинг-провайдер закроется.

В зависимости от важности домена и проекта для меня, я использую разные варианты, комбинирую.

3. Завести хостинг

Тут опять же много вариантов:

— Простой хостинг или выделенный сервер
— Хостинг там же, где домен или отдельно
— Уже у вас был хостинг или вы заводите новый.