| | Welcome to piLEARN's inaugural article. I'm aware that some readers are meeting RISC OS for the first time and so I've thought carefully about what would make an interesting and lively introduction. I felt I needed to present a tutorial that explained how the RISC OS desktop worked whilst also making progress towards creating something useful. A further desire in my mind was to get cracking on writing computer program code.
As the banner proclaims, I've decided to demonstrate how utterly simple it is to write a straightforward website by hand. I am an expert on this. Indeed, piLEARN is an example of such a website. It's not an all bells and whistles production, but is functional and easy to update and maintain. That sets me free to focus on the content. To me, a website is simply a way of presenting ideas to the world. The site itself should certainly not get in the way of that. It does not even have to be particularly noticable although it should ideally have a subtle personality and character that makes it unique. What I will present in this series of articles is a starting point. Many readers will end up producing websites far more slick and polished than piLEARN, using sophisticated website creation tools. Here the focus will be on simple but effective.
Any author has to decide on a starting point. I'm going to assume that readers have got RISC OS running on a Raspberry Pi. I'm also going to assume that the NetSurf web browser is available on the system. NetSurf has the destinctive logo shown in figure 1. If you have seen that logo since powering up the device, then NetSurf is ready. For help with installing either RISC OS or NetSurf, seek assistance. I'm writing this a few weeks ahead of Raspberry Pi going into production, and so am running RISC OS on an Iyonix networked to a StrongARM Risc PC. Once Pi is out I'll adjust the article to ensure it relates to the real Raspberry Pi.
figure 1 figure 2
RISC OS comes with a number of built in applications. These are revealed by using the mouse to left click on the folder on the icon bar called Apps. This folder will look something like figure 2. A window will open on the desktop. Mine contains the seven applications shown in figure 3.
figure 3
Double left click on the application called !Edit. A left click on the three button mouse is refered to as select. The Edit icon will appear on the right hand side of the icon bar. Click the Edit icon on the icon bar using the centre mouse button, which may be a scroll wheel. The centre button on the three button mouse is refered to as menu. The left part of the menu tree shown in figure 4 will appear. Move the mouse pointer over the word 'Create' and move right. This will cause the 'Create' sub-menu to appear. Go down to the bottom of this where a red caret is sitting. This is a writable menu entry. Type 'html' so that your menu tree looks like figure 4.
figure 4
Now click the 'html' menu item with select, the left mouse button. The window, <untitled> in figure 5, will open on the desktop. Into this type "Welcome to my website."
figure 5
Having made a webpage, the next job is to park it somewhere. The star next to <untitled> indicates unsaved data is in the window. I've got a standard USB pen drive. By standard, I mean it's FAT32 formatted and can be read by Windows or Apple computers as well as RISC OS on Rasperry Pi. When I plug it into a USB socket, the icon shown in figure 6 appears on the left hand side of the icon bar.
figure 6
Select click this and the window Fat32Fs::MartinPen.$ opens on the desktop, figure 7.
figure 7
Back over the <untitled> window, menu click to bring up Edit's main menu. Move down to 'Save' and across right to bring up the 'Save as' sub-menu. By default, the saved file will be called EditFile, figure 8. Alter the writable icon so that it reads index/html, figure 9.
figure 8 figure 9
By default, when a website is placed on the internet, the file index/html is displayed first. As our website currently is but a single webpage, it needs to be called that. To actually save the file it is drag and dropped from the 'Save as' sub-menu window to the pen-drive window, Fat32Fs::MartinPen.$. To do this use select to click and hold with the mouse pointer over the icon in 'Save as'. By this I mean get the pointer over the image of a globe and document, figure 10, and then click and keep the mouse button held down.
figure 10
With select still held down, move the mouse towards the pen-drive window. Once over that window, release select. If you get this right, the menu tree will close and the Fat32Fs::MartinPen.S window will display the file index/html. The star by <untitled> will vanish, and <untitled> will be replaced with Fat32Fs::MartinPen.$.index/html which is RISC OS telling us the filer path to where the file is stored. Saving the file in future is much easier now that RISC OS knows where to place it. Next time simply open the menu tree as before but in the 'Save as' sub-menu window, a click on OK will overwrite the file with an updated one.
With the file saved, close the window into which was typed "Welcome to my website". Do this by using select to click on the × towards the left hand end of the window's title bar. The webpage made can now be viewed in any browser. So, for example, you could insert the pen-drive into an Apple MacBook Pro laptop and run index/html in Safari, figure 11.
figure 11
Back on Raspberry Pi, a double click on the file index/html will cause RISC OS to run the webpage in NetSurf with much the same result as on the Apple Mac.
This article has been more about using RISC OS than about building a webpage. However, the way RISC OS saves files and uses the mouse is common to all applications. Having now covered these basics, next time I'll focus more upon the actual design of the webpage. To finish, I'll mention that by holding down the <shift> key and double clicking the index/html file will cause it to open up for editing.
Homework
Find out how to write text in italics in html.
Can you write a word in red ?
(You'll need an American word, 'color')
What other html tags can you find and use ?
Summary
01. RISC OS's mouse has three buttons; select, menu, and adjust.
02. Open the Apps folder on the icon bar.
03. Load !Edit from the Apps directory onto the icon bar.
04. Click menu over Edit on the icon bar, and move to the 'Create' sub-menu.
05. Type 'html' then select on this.
06. Type "Welcome to my website" into the window that opens.
07. Open the pen-drive filer window.
08. Use menu to open Edit's 'Save as' window.
09. Rename the file, index/html
10. Drag and drop the file into the pen-drive filer window.
11. A double click on the file will display it in NetSurf.
12. <Shift> plus double click opens the file for editing.
| |
