Products Demo Page

Создаем динамические веб-сайты с помощью PHP, MySQL, JavaScript, CSS и HTML5 (pdf+epub)

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

Те, кто искали эту книгу – читают

  • Объем: 832 стр.
  • Жанр:з арубежная компьютерная литература, и нтернет, п рограммирование
  • Теги:C SS, H TML, J avaScript, M ySQL, P HP, в еб-программирование, с оздание сайтов, ф реймворкиРедактировать

По абонементу вы каждый месяц можете взять из каталога одну книгу до 700 ₽ и две книги из специальной подборки. Узнать больше

Новое издание бестселлера описывает как клиентские, так и серверные аспекты веб-разработки. Книга, наполненная ценными практическими советами и подробным теоретическим материалом, поможет вам освоить динамическое веб-программирование с применением самых современных технологий. Для закрепления усвоенных знаний автор расскажет, как создать полнофункциональный сайт, работающий по принципу социальной сети. После покупки предоставляется дополнительная возможность скачать книгу в формате epub.

Возрастное ограничение: 16+ Дата выхода на ЛитРес: 04 февраля 2015 Дата перевода: 2022 Дата написания: 2021 Объем: 832 стр.

ISBN: 978-5-4461-1970-7 Общий размер: 27 MB Общее кол-во страниц: 832 Размер страницы: Переводчик: Правообладатель: Питер

Книга Робина Никсона «Создаем динамические веб-сайты с помощью PHP, MySQL, JavaScript, CSS и HTML5 (pdf+epub)» — скачать в pdf или читать онлайн. Оставляйте комментарии и отзывы, голосуйте за понравившиеся.

Отзывы 6

Отличная книга. Изложение доступное и понятное, читается гораздо легче и быстрее, чем большинство книг по программированию. Ещё одно огромное преимущество – практический подход. В первых же главах автор делится информацией о подходящих IDE, сервере Apache и способах их установки, а также даёт понять, что все примеры из книги нужно сразу тестировать на практике, что и я настоятельно рекомендую.

Отлично рассказано про ООП. Благодаря практическому подходу разобраться в нём (или систематизировать то, что усвоено из других источников и лично на практике) легко и просто.

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

PS: Есть минус перевода. При работе со строками автор часто использует функции вроде ucfirst(), которые не работают с кириллицей, при этом сами строки, как правило, переведены на русский язык. Таким образом, если вы просто скопируете такой пример, он нормально работать не будет. Тут нужно или писать строки на латинице, или использовать аналогичные функции для mbstring (напр. mb_substr() вместо substr()), когда они есть в php, либо, если готовых решений в php нет, писать/подбирать «костыли», которых немалое количество в интернете.

Читайте также:  Java required что это

И лучше сразу сделать стандартный шаблон с html-тегами, в котором будет прописана кодировка «UTF-8» в метатегах, иначе устанете воевать с кракозябрами при работе с кириллицей.

Источник

Создаем динамические веб-сайты с помощью PHP, MySQL, JavaScript, CSS и HTML5.

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

Для этого достаточно обладать базовыми знаниями языка HTML. Это популярное и доступное пособие поможет вам уверенно освоить динамическое веб-программирование с применением самых современных языков и технологий: PHP, MySQL, JavaScript, CSS и HTML5.

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

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

Откройте для себя базу данных MySQL. Управляйте cookie-файлами и сеансами, обеспечивайте высокий уровень безопасности. Пользуйтесь фундаментальными возможностями языка JavaScript.

Применяйте вызовы AJAX, чтобы значительно повысить динамику вашего сайта. Изучите основы CSS для форматирования и оформления ваших страниц.Познакомьтесь с возможностями HTML5: геолокацией, работой с аудио и видео, холстом.

Фактически любой человек, стремящийся изучить основные принципы, заложенные в основу технологии Web 2.0, известной как AJAX, сможет получить весь-AJAX, сможет получить весьма обстоятельные сведения об основных технологиях: PHP, MySQL, JavaScript, CSS и HTML5, а также изучить основы библиотеки jQuery.

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

Источник

HTML CSS Javascript PHP MySQL To Build A Website (Simple Example)

Welcome to a beginner’s tutorial and simple example of how to use HTML, CSS, Javascript, PHP, and MySQL together to build a website. Just started with web development, and wondering how we can “put” all the different technologies together?

Various technologies and languages work together to create a website, each of them handling a different aspect.

  • HTML deals with the structure and layout of web pages.
  • CSS to handle the visuals and cosmetics.
  • Javascript to add dynamic elements to the webpage.
  • MySQL database to store data permanently.
  • PHP to do server-side processing and transactions.

Yep, some of you guys may already know that. So let us walk through the development of a simple product page in this guide – Read on!

TABLE OF CONTENTS

EXAMPLE DEVELOPMENT CYCLE

All right, let us now get started with the development of the products page itself.

STEP 1) THE PLAN – DIVIDE AND CONQUER

  • Goal & Overview: As Captain Obvious as this may be, we need to create a page to display products from the database.
  • Server-Side Database (MySQL): To keep things simple, the database will only capture the product name and description.
  • Server-Side PHP: Create a script that gets product information from the database.
  • Client-Side HTML & CSS: Use the PHP script to create an HTML page to show the products, CSS for the styling.
  • Client-Side Javascript: Finally, use Javascript to add dynamic elements to the HTML page. For example, what happens when the user clicks on a product.
Читайте также:  Css grid выравнивание внутри блока

STEP 2) CREATING MYSQL DATABASE TABLES

2A) THE SQL

-- (A) PRODUCTS TABLE CREATE TABLE `products` ( `product_id` bigint(20) NOT NULL, `product_name` varchar(128) NOT NULL, `product_description` text ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; ALTER TABLE `products` ADD PRIMARY KEY (`product_id`), ADD KEY `product_name` (`product_name`); ALTER TABLE `products` MODIFY `product_id` bigint(20) NOT NULL AUTO_INCREMENT; -- (B) DUMMY PRODUCTS INSERT INTO `products` (`product_id`, `product_name`, `product_description`) VALUES (1, 'Vulture Of Fortune', 'A sweated bump consents across the here separator.'), (2, 'Guardian Without Duty', 'Does a table migrate inside an excessive paranoid?'), (3, 'Enemies Without Hope', 'A cured parameter fears behind the phenomenon.'), (4, 'Lords Of The Void', 'The diary scores around the generalized lie.'), (5, 'Doctors And Aliens', 'The diary scores around the generalized lie.'), (6, 'Blacksmiths And Criminals', 'A considerable snail works into a purchase.');

2B) TABLE STRUCTURE

2C) MYSQL DATABASE NOTES & EXPLANATION

Personally, I will always start with the database, simply because it serves as the foundation of almost every project. It is also important to get the required fields correct right from the start, or changing the database structure later can be a very painful process.

STEP 3) SERVER-SIDE PHP SCRIPTS

3A) THE SCRIPT

 PDO::ERRMODE_EXCEPTION, PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_NAMED ]); // (C) GET PRODUCTS $stmt = $pdo->prepare("SELECT * FROM `products`"); $stmt->execute(); $products = $stmt->fetchAll();

3B) PHP NOTES & EXPLANATION

PHP is the next piece of the foundation, and the above is an oversimplified example of how we can use PHP to fetch data from the database… But this is actually kind of bad. In actual projects, we would have created a proper class library, object-oriented style. For example:

class Products < function get ($id) < // SELECT * FROM `products` WHERE `id`= $ID >function add ($name, $desc) < // INSERT INTO `products` (. FIELDS . ) >function delete ($id) < // DELETE FROM `products` WHERE `id` = $ID >>

STEP 4) HTML PAGE

4A) THE SCRIPT

       
?>

4B) HTML NOTES & EXPLANATION

So what is happening here!? Why is the file extension PHP instead of HTML? That’s right – We are using PHP alongside HTML here. No need to be confused. Remember the script we wrote earlier to fetch product data from the database? We are simply using it on this page to generate the product’s HTML, that’s all.

STEP 5) THE CSS

5A) THE SCRIPT

/* (A) WHOLE PAGE */ * < font-family: Arial, Helvetica, sans-serif; box-sizing: border-box; >body < max-width: 600px; padding: 10px; margin: 0 auto; background: #f2f2f2; >/* (B) BOOKS */ #books < display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: 10px; >.bookWrap < border: 1px solid #dbdbdb; background: #fff; >.bookImg < display: block; width: 100%; >.bookTitle < font-weight: 700; font-size: 16px; color: #333; >.bookDesc

5B) CSS NOTES & EXPLANATION

Nothing much here actually. CSS is the part that deals with cosmetics and styles in HTML.

STEP 6) THE JAVASCRIPT

6A) THE SCRIPT

window.addEventListener("load", () => < // (A) GET ALL BOOKS var books = document.querySelectorAll(".bookWrap"); // (B) ATTACH ONCLICK TO ALL BOOKS for (let book of books) < book.onclick = () =>< // (B1) GET SELECTED BOOK ID, NAME, DESCRIPTION var name = book.querySelector(".bookTitle").innerHTML, desc = book.querySelector(".bookDesc").innerHTML; // (B2) SHOW IN DIALOG BOX alert(`You have selected - ID: $, TITLE: $ DESC: $`); >; > >);

6B) JAVASCRIPT NOTES & EXPLANATION

This is yet another overly simplified example. On a “normal” products page, Javascript would have been used to send an “add to cart” process to the server when a product is selected. Also, you can pretty much already guess what Javascript can do – Remove from the cart, checkout, submit forms, form checks, load more content from the server, change themes, etc… Pretty much all kinds of processing that are dynamic.

DOWNLOAD & NOTES

Here is the download link to the example code, so you don’t have to copy-paste everything.

SUPPORT

600+ free tutorials & projects on Code Boxx and still growing. I insist on not turning Code Boxx into a «paid scripts and courses» business, so every little bit of support helps.

EXAMPLE CODE DOWNLOAD

Click here for the source code on GitHub gist, just click on “download zip” or do a git clone. I have released it under the MIT license, so feel free to build on top of it or use it in your own project.

That’s it for all the code, and here are a few small extras that may be useful.

SOFTWARE DEVELOPMENT LIFE CYCLE (SDLC)

  • Requirement Analysis – What is required? What does the client need?
  • Planning – Divide-and-conquer. What needs to be done?
  • Design – The database structure, software architecture, and page design.
  • Development – Actual coding.
  • Testing & Deployment – Test the code, and put it live on the Internet.

Some people may have different steps for the SDLC, but that is the general process. Also, take note that SDLC does not stop after just one cycle – We may review our projects later, and decide that things need to change. The whole SDLC cycle starts again, and it never really ends.

FRONT-END, BACK-END, FULL-STACK

  • Project Manager (Full-Stack) – The boss. He/she/it deals with the wide overview, processes, structure of the entire system, and even support for other platforms such as mobile apps.
  • Lead/Senior Web Developers (Full-Stack) – Does everything. HTML, CSS, Javascript, PHP, MySQL, and whatever else. AKA Superman.
  • Junior Web Developers (Front End) – Creates the webpages. HTML, CSS, Javascript.
  • Junior Web Developers (Back End) – Does PHP, MySQL. More on the administration panel and server-side libraries instead.

So yeah, it is only further up the ladder that we need to really deal with “everything and beyond”.

INFOGRAPHIC CHEAT SHEET

THE END

Thank you for reading, and we have come to the end of this guide. I hope that it has helped you to better understand – HTML, CSS, Javascript, PHP, MySQL, they are all different components, but they all work together to create a single website or system.

It may be overwhelming at first to deal with many things at once, so take it step-by-step, and the rest will be just like learning how to cycle. Once you catch the gist and flow, it will be much easier. If you want to share anything with this guide, please feel free to comment below. Good luck and happy coding!

Источник

Оцените статью