[2024-feb-29] Sad news: Eric Layton aka Nocturnal Slacker aka vtel57 passed away on Feb 26th, shortly after hospitalization. He was one of our Wiki's most prominent admins. He will be missed.

Welcome to the Slackware Documentation Project

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
howtos:misc:approach_to_web_development_on_slackware [2020/11/21 17:00 (UTC)] – [Web Dev primarily HTML and PHP] captain_sensiblehowtos:misc:approach_to_web_development_on_slackware [2020/12/01 16:54 (UTC)] (current) – [Structure of HTML & PHP] captain_sensible
Line 4: Line 4:
  
  
-I'm going to give an overview of web development for users of Slackware. It's going to be from the perspective of approaches for a budding web developer who uses Slackwarethe problems you might face due to using Slackware Linux and an eclectic look at what tools are available to help you, starting simplest first. There will be some embedded information on HTML and PHP, what they do and what they do not do.I will probably htrow in some anecdotal  info from my experience.+I'm going to give an overview of web development for users of Slackware.It's going to be from the perspective of approaches for a budding web developer who uses Slackwarethe problems you might face due to using Slackware Linux and an eclectic look at what tools are available to help you, starting simplest first. 
 + 
 +There will be some embedded information on HTML and PHP, what they do and what they do not do. I will probably throw in some anecdotal  info from my experience. 
 + 
 +==== Structure of HTML & PHP ====
  
      
Line 24: Line 28:
 </code> </code>
  
-If you're good at geometric progressions, you will straight away see common re-occurring elements  <> and </>; HTML  +If you're good at geometric progressions, you will straight away see common re-occurring elements  <> and </>; HTML is not programming code but merely about how things should be presented or markup. Its a web browser that does the interpretation of the tags and then presents the content according to the markup. 
-is not programming code but merely about how things should be presented or markup. +
  
-<> designates the start of markup and </> the end of the markup. The file is conveniently organized into head and body areas and the whole text wrapped by <html> which indicates start of a HTML document and by </html> which indicates HTML document has come to an end.+<> designates the start of markup and </> the end of the markup. The file is conveniently organized into head and body areas and the whole text wrapped by <html> which indicates start of a HTML document and by </html> which indicates HTML document has come to an end.
  
 +So as a developer, you have two perspectives working with HTML; the text if the file is opened with a text editor and how it looks after a web browser has digested what's written  and then presented it (also called has rendered document).
  
-I previously said HTML is markup, but what interprets the mark up?+HTML is not the only text document that has associated with it instructions of how it should look. When you use a word processor like LibreOffice you see the text as you type, but behind the scenes the text has associated with it instructions such as font type, font size, and so on. For this reason, never use a word processor when constructing HTML documents, since you will have to edit out the accessory info. 
  
-The markup in a HTML is specifically aimed at web browsers+There are many alternatives to working with HTML documents using a text editor, but as good as any in my opinion is geany available from [[slackbuilds.org]].It has basic text highlighting and gets the job done.
  
-So as a developer, you have two perspectives working with HTML; the text, if the file is opened with a text editor and how it looks after a web browser has digested what's written inside and then presented it (also called has rendered document). 
  
-HTML is not the only text document that has associated with it instructions of how it is intended to look. When you use a word processor like LibreOffice you see the text as you type, but behind the scenes the text has associated with it instructions such as font type, font size, and so on. For this reason, never use word processor when constructing HTML documents, since you will have to edit out the accessory info. +==== Using Built in PHP dev Server to render HTML ====
  
-There are many alternatives to working with HTML documents, but as good as any in my opinion is Geany available from [[slackbuilds.org]]. It has basic text highlighting and gets the job done. 
  
-Now, if we were working with Geany and saved the above text as a file, lets make it index.html and save it to Desktop. We have two choices; open and edit with a text editor or open it as intended with a web browser. If you do that, all you will see is "hello world" 
  
-You could, if you want, have several files on your Desktop and right click with the mouse to look at them. That's rather inconvenient and making poor use of a web browser. Inside let's organize things and put files together in a directory on the Desktop; let's call it //webPlay//.+Now, if we were working with geany and saved the above text as a file say  index.html to your  Desktop, you then  have two choices; open and edit with a text editor or open it as intended with a web browser. If you do that, all you will see is "hello world".  
 + 
 +You could, if you want, have several thousand files on your Desktop and right click each one with the mouse to look at them. That's rather inconvenient and making poor use of a web browser. Inside let's organize things and put files together in a directory on the Desktop; let's call it //webPlay//.
  
 So, this is what we now have on our Desktop: So, this is what we now have on our Desktop:
Line 49: Line 52:
 webPlay webPlay
 └── index.html └── index.html
- 
 </code> </code>
  
  
-We only have one file at the moment in directory webPlay; we could put K's in that single directory and right click to open each with a web browser. When Tim Berners-Lee came up with the idea of HTML (hypertext markup language), he also had a vision of an architecture of how researchers at one institute would request a document and "get" it and view it. +We only have one file at the moment in our directory ; we could put 1000's in that single directory and right click to open each with a web browser. When Tim Berners-Lee came up with the idea of HTML (hypertext markup language), he also had a vision of an architecture of how researchers at one institute would request a document  "get" it and view it. 
  
 Software that can be leveraged to make things convenient involves being able to "listen" to requests made by a browser and to respond to that request or, to put it another way, deliver the document.  Software that can be leveraged to make things convenient involves being able to "listen" to requests made by a browser and to respond to that request or, to put it another way, deliver the document. 
Line 70: Line 72:
 Copyright (c) The PHP Group Copyright (c) The PHP Group
 Zend Engine v3.4.0, Copyright (c) Zend Technologies Zend Engine v3.4.0, Copyright (c) Zend Technologies
-    with Zend OPcache v7.4.1, Copyright (c), by Zend Technologies+with Zend OPcache v7.4.1, Copyright (c), by Zend Technologies
 bash-5.0$  bash-5.0$ 
 </code> </code>
  
-So, I have PHP version 7.4.1 available, which is very useful since most modern web software like CodeIgniter require PHP 7 and above. That version of PHP came with Slackware -current which I upgraded to early last year (5.4.12) - a very good vintage!+So, I have PHP version 7.4.1 available, which is very useful since most modern web software like CodeIgniter require PHP 7 and above as stated on the documentation of CodeIgniter4. That version of PHP came with Slackware -current which I upgraded to early last year (5.4.12) - a very good vintage!
  
 Let's fire up the dev server and "point it" to where our HTML files are: Let's fire up the dev server and "point it" to where our HTML files are:
Line 86: Line 88:
 </code> </code>
  
-When I open up the Terminal Emulator, it opens with the "context" that it is at ~ +When I open up the Terminal Emulator, it opens with the "context" that it is at ~ i.e home
  
 So, I change directory to Desktop, because that's where my directory containing my HTML file is. I also tell PHP, via the terminal, that I would like to use localhost and port 8080. So, I change directory to Desktop, because that's where my directory containing my HTML file is. I also tell PHP, via the terminal, that I would like to use localhost and port 8080.
Line 101: Line 103:
  
    
-A single index.html is about as simple as you can get; if you uploaded it say via cPanel on hosting, and then you pointed your website domain to that hosting, as instructed by your hosting company then you will have a simple, but working one page web site.+A single index.html is about as simple as you can get; if you uploaded it say via cPanel on hosting, and then you pointed your website domain to your hosting, as instructed by your hosting company then you will have a simple, but working one page web site.
  
-More sophisticated web systems such as WordPress still have somewhere within them index.php (with WP its located at the web root). In these cases, the index.php is often referred to as the "bootstrap" not to be confused with front-end Twitter Bootstrap.+More sophisticated web systems such as WordPress still have somewhere within them one or more index.php (with WP its located at the web root). In these cases, the index.php file is often referred to as the "bootstrap" not to be confused with front-end Twitter Bootstrap.
  
-Before we move on to PHP let's have a last look at HTML and how to link one page to another. Go to Geany ->file->new with template->file_html5.html. That produces a ready made html5 template. All you have to do is name it and save it somewhere. Save it to /Desktop/webPlay as about_me.html.+Before we move on to PHP let's have a last look at HTML and how to link one page to another. Go to geany ->file->new with template->file_html5.html. That produces a ready made html5 template. All you have to do is name it and save it somewhere. Save it to /Desktop/webPlay as about_me.html.
  
 Open it up and in the <body> </body> write a few words. Open it up and in the <body> </body> write a few words.
Line 130: Line 132:
  
 Click on the line that says //about_me// and you will see that the HTML document about_me.html is now rendered. You now have the basis for a few pages on your web site. Some will pooh-pooh this, but it's better than the option of no web site, if you are a small business. Without a web site in today's world, you can't be found. Click on the line that says //about_me// and you will see that the HTML document about_me.html is now rendered. You now have the basis for a few pages on your web site. Some will pooh-pooh this, but it's better than the option of no web site, if you are a small business. Without a web site in today's world, you can't be found.
 +
 +
 +==== Making use of HTML presentation but with PHP functionality ====
  
  
Line 163: Line 168:
 </code> </code>
  
-Refresh your browser and now what do you see?Quite a lot!+Refresh your browser and now what do you see? Quite a lot of information concerning PHP!
 When I first did this it demonstrated the potential of PHP.  When I first did this it demonstrated the potential of PHP. 
 +
 +==== Introducing Databases into the mix  ====
 +
 +
 Next we will have a simple look at using a database.When you mention anything about databases most people immediately think MySQl or Maria;so you can't do anything with a database on your Desktop since you need a daemon. Well actually you can since sqlite3 is server-less. Next we will have a simple look at using a database.When you mention anything about databases most people immediately think MySQl or Maria;so you can't do anything with a database on your Desktop since you need a daemon. Well actually you can since sqlite3 is server-less.
 Assuming our Terminal Emulator is in webPlay lets create a database from the command line. Actually lets first check we have the tools in place: Assuming our Terminal Emulator is in webPlay lets create a database from the command line. Actually lets first check we have the tools in place:
Line 249: Line 258:
  
  
-So here we just did a retrieval of data; its one small step from there to insert, update all part of what is referred to as "crud" operations. html files are just static files that have markup on how the static content is presented. php on the other hand is a rich fully functional programming language that you can either use in an OOP way. In other words create classes which have methods or in a procedural way.+So here we just did a retrieval of data; its one small step from there to insert, update all part of what is referred to as "crud" operations. HTML files are just static files that have markup on how the static content is presented. php on the other hand is a rich fully functional programming language that you can either use in an OOP way. In other words create classes which have methods or in a procedural way.
  
-A couple of other things to mention php, is a scripting language; an "engine" such as Zend processes  the code, then renders output to the browser. +A couple of other things to mention PHP, is a scripting language; an "engine" such as Zend processes  the code, then renders output to the browser. 
  
-So what i have demonstrated here is that you can go a long way developing php on your Desktop.You may have noticed  that no mention was made of the word chmod nor permissions. Everything we did was in user space, so you don't have to worry about that. With files located in our user space we have both read and write permissions to them. I mention it here, since later that's going to be a problem when we look at xampp and apache, +So what i have demonstrated here is that you can go a long way developing PHP on your Desktop.You may have noticed  that no mention was made of the word chmod nor permissions. Everything we did was in user space, so you don't have to worry about that. With files located in our user space we have both read and write permissions to them. I mention it here, since later that's going to be a problem when we look at xampp and apache, 
 which is another approach for working with web development.  which is another approach for working with web development. 
  
 +
 +==== PHP framework ====
  
 Before we look at xampp and apache i'm going to mention composer [[https://getcomposer.org/|composer ]] Before we look at xampp and apache i'm going to mention composer [[https://getcomposer.org/|composer ]]
  
-When your working with single html or php files, you will find you the need to update them that's not too much of a problem. When you work with more complicated web applications say CodeIgniter, new releases come out and then you have 3rd party software installed as well which have dependencies.Things can soon get out of hand. The use of composer helps updating and managing dependencies. +When your working with single HTML or PHP files, you will find you the need to update them that's not too much of a problem. When you work with more complicated web applications say CodeIgniter, new releases come out and then you have 3rd party software installed as well which have dependencies.Things can soon get out of hand. The use of composer helps updating and managing dependencies. 
  
 I've used it in 2 ways.   I've used it in 2 ways.  
Line 310: Line 321:
 </code> </code>
    
-A little bit about php frameworks. A few html or php files is ok for a small website but php frameworks come in handy where you are going to do a lot of work with data. Frameworks have a design of logic that splits  what you see, what does the  processing, and what connects to database into whats called MVC (model,view,controller).+A little bit about PHP frameworks. A few HTML or PHP files is ok for a small website but PHP frameworks come in handy where you are going to do a lot of work with data. Frameworks have a design of logic that splits  what you see, what does the  processing, and what connects to database into whats called MVC (model,view,controller).
  
-php built in server or using spark have their limitations; if you insist on wanting to use MySQl or Maria then you have to consider something like xampp or apache. +PHP built in server or using spark have their limitations; if you insist on wanting to use MySQl or Maria then you have to consider something like xampp or apache. 
  
 Now xampp from apachefriends [[https://www.apachefriends.org/index.html|xampp ]]is basically a bundled unit of a web server and supporting files. Now xampp from apachefriends [[https://www.apachefriends.org/index.html|xampp ]]is basically a bundled unit of a web server and supporting files.
Line 318: Line 329:
 It comes with an installer and I have previously tried it on Slackware. Although it comes with an installer it is not installed on your system but is put in /opt and the way i view it is that it is an "embedded system" It comes with an installer and I have previously tried it on Slackware. Although it comes with an installer it is not installed on your system but is put in /opt and the way i view it is that it is an "embedded system"
  
-There are pro's and cons. Its doesn't use your system php as far as i understand it, so your own php might be more up to date than xampp, then there are issues like updating. From my limited understanding a web server does not come as default with other distros, so for them they have the choice: should I install apache or give xampp a go, maybe thinking at least I won't bork my system- its quite understandable.+There are pro's and cons. Its doesn't use your system PHP as far as i understand it, so your own PHP might be more up to date than xampp, then there are issues like updating. From my limited understanding a web server does not come as default with other distros, so for them they have the choice: should I install apache or give xampp a go, maybe thinking at least I won't bork my system- its quite understandable. 
 + 
 + 
 +==== Setting up a Development Environment using Apache ====
  
  
Line 327: Line 341:
 </code> </code>
  
-Thats where we are now going to move our CI4 to. I must at this point put in a disclaimer that i'm writing from my experience of getting things going. I have for a few months been writing a light C.M.S system on top of CodeIgniter 4.0.4; i've had no glitches, no crashes or anything else detrimental- so i'm assuming from empirical observation I must have half a clue- others might point out how it could be bettered. +Thats where we are now going to move our CI4 to. I must at this point put in a disclaimer that I'm writing from my experience of getting things going. I have for a few months been writing a light C.M.S system on top of CodeIgniter 4.0.4; I've had no glitches, no crashes or anything else detrimental- so I'm assuming from empirical observation I must have half a clue- others might point out how it could be bettered. 
  
 Ok this is one way  I use CodeIgniter in apache: Ok this is one way  I use CodeIgniter in apache:
Line 340: Line 354:
 # mv CI4.zip /var/www/htdocs  # mv CI4.zip /var/www/htdocs 
 </code> </code>
 +
 +===  Approach To permission problems ===
  
  
-Now i will talk generally about problems  with permissions for developers. For those coming from Windows,who have done web development they get a bit of a shock when they move to Linux. As a "normal user" you don't have any authority to do any editing of code of a web app directory located within htdocs  located at /var/www/htdocs . Thats because they are within  your root system. +Now i will talk generally about problems  with permissions for developers. For those coming from Windows,who have done web development they get a bit of a shock when they move to Linux. As a "normal user" you don't have any authority to do any editing of code of a web app directory located within htdocs  located at /var/www/htdocs . That'because they are within  your root system. 
  
 Now this is where perhaps the bone of contention sets in;you want to get on editing and developing but you don't want to mess your system up either.You could do su->password-># i.e shift to root but that wouldn't be a good idea, when all sorts of strange things could happen. With root permission you could delete or edit something you didn't want to do. So whats the answer? Well there are a few approaches. Now this is where perhaps the bone of contention sets in;you want to get on editing and developing but you don't want to mess your system up either.You could do su->password-># i.e shift to root but that wouldn't be a good idea, when all sorts of strange things could happen. With root permission you could delete or edit something you didn't want to do. So whats the answer? Well there are a few approaches.
Line 413: Line 429:
 secrets when I show you my local WP ;it looks like this: secrets when I show you my local WP ;it looks like this:
  
-{{:howtos:misc:wp_users.jpg?600|}}+{{:howtos:misc:wp_users.png?600|}}
  
 Its an extract of how WP uses Sqlite (yes you can opt for sqlite  instead with WP)   WordPress seems to be poorly written and a word of warning; in a default install its possible to display user login credentials via a simple get request to the domain!So the security of connecting to a database adds nothing to the security of your user credentials with WP Its an extract of how WP uses Sqlite (yes you can opt for sqlite  instead with WP)   WordPress seems to be poorly written and a word of warning; in a default install its possible to display user login credentials via a simple get request to the domain!So the security of connecting to a database adds nothing to the security of your user credentials with WP
Line 489: Line 505:
  
 Note the 127.0.0.9 in address bar and that I can now work with framework and edit as user andrew , without risk of messing up system as root. If you follow this through and you get a problem its probably either your php version is < than 7.3 or I did something somewhere forgot about it and  forgot to mention . Note the 127.0.0.9 in address bar and that I can now work with framework and edit as user andrew , without risk of messing up system as root. If you follow this through and you get a problem its probably either your php version is < than 7.3 or I did something somewhere forgot about it and  forgot to mention .
 +
 +
 +
  
  
 ====== Sources ====== ====== Sources ======
 +
 +
 <!-- If you are copying information from another source, then specify that source --> <!-- If you are copying information from another source, then specify that source -->
 <!-- * Original source: [[http://some.website.org/some/page.html]] -of -> <!-- * Original source: [[http://some.website.org/some/page.html]] -of ->
 <!-- Authors are allowed to give credit to themselves! --> <!-- Authors are allowed to give credit to themselves! -->
-<!-- * Originally written by [[wiki:user:xxx User X]] -->+ Originally written by [[wiki:user:captain_sensible  captain_sensible]] 
 <!-- * Contributions by [[wiki:user:yyy | User Y]] --> <!-- * Contributions by [[wiki:user:yyy | User Y]] -->
  
 howtos:misc:approach_to_web_development_on_slackware ()