Loading Pier 3.2 into Pharo 7

A semi-regular reminder of how to install and load Pier into Pharo, older notes:

Steps:

  1. Installing Pharo and start from a command line of Linux or MacOS (alternatives are listed on the Pharo site):

     mkdir Pharo && cd Pharo
     curl -L https://get.pharo.org/64/ | bash

    This should download some files, and finish with: Creating starter scripts pharo and pharo-ui. Smalltalks generally have a changes and image files that work in pairs, create a copy of the default:

     ./pharo Pharo.image save pier

    Start the image with:

     ./pharo-ui pier.image

    By clicking on an empty space, a menu opens up, it should look like:

    pier.image Tools -> Playground
  2. Install Pier from Git (this is in the workspace http://ws.stfx.eu/RMGLE7SK4XXI:

    Transcript open.
    Metacello new
      baseline:'PierAddons';
      repository: 'github://Pier-CMS/Pier3:master/repository';
      onConflictUseLoaded;
      load.

    The program should look like:

    Running Pier on MacOS
    More details on loading Pier are at Loading with Metacello.
  3. Load Google code - Open Iceberg with command-o-i, or from the world menu under Tools -> Iceberg. Select Pier3 and right-click to get the packages option. Search for Google at the bottom and select and load it.
    Iceberg text
    Verify progress by running this to open a web browser on the local instance:

    WebBrowser openOn: 'http://localhost:8080/pier'.

    Note that the debug tools (New Session, Configure, etc) at the bottom of the page.

    New Session Configure Halos Profile Memory
  4. Remove pier from the address and it goes to the seaside test page:
    localhost:8080
    Run this to resolve that:

    WAAdmin defaultDispatcher defaultName: 'pier'. "Set Pier as the default for http://localhost:8080/"

  5. To remove the development tools (the bar at the bottom that includes New Session and Configure), run this:

    WAAdmin applicationDefaults removeParent: WADevelopmentConfiguration instance.

    Next open the config screen and replace the cache on this screen:

    WebBrowser openOn: 'http://localhost:8080/config/pier'.

    Clear Cache
    Answer Yes to 'This will clear all existing sessions in the current cache. Are you sure you want to continue?'
  6. Remove extra handlers:

    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'tools').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'examples').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'status').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'tests').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'javascript').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'bootstrap').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'welcome').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'piersetup').
    WAAdmin defaultDispatcher unregister: (WAAdmin defaultDispatcher handlerAt: 'browse').

    The resulting list on the config page should only be:

     ./		Dispatcher
     config		Application
     files	File 	Library
     magritte/	Dispatcher
     pier (*)	Application
     seaside	Legacy redirection

    Open a browser on localhost and port 8080 - this should open to the pier page because it is the default:

    WebBrowser openOn: 'http://localhost:8080'.

  7. Users who are not admin can edit pages, this makes it fast for testing things, but not secure. A plan is to first login, set the owner of the wiki, then remove anonomous editing so it is secure.
    1. Login with the admin user by clicking the login link, and entering admin as the user:
      Pier Username: admin
      The default password is the application name as lowercase.
    2. Check that the address starts with: http://localhost:8080/pier?_s... so it is on the pier page. Choose the option 'Change Owner' and select 'Recursive' and all permissions (admin automatically has all permissions), and apply:
      Pier Current: checked, Recursive: checked, Owner: admin, Operator: set, Permissions: All
    3. Choose the option: 'Change Other', select Recursive and remove - for the Permissions select everything but view and click apply (select all for the permissions, and control click view so it is not selected).
      Pier Current: checked, Recursive: checked, Operator: remove, Permissions: All but view
    4. After clicking logout, the edit options should not be viewable, these are the view options:

      Browse
      Changes
      Changes (RSS)
      Diff
      Diff (RSS)
      File
      Halos
      Log
      Log (RSS)
      Search
      Text
      View
      Wiki
      Login
      View

    5. Use the 'Login' link to re-login and change the password using the 'Edit User' link.
  8. Create a system page for managing settings by clicking 'Add', naming it 'system' and selecting PRPage:
    Pier Name: system, Type: PRPage, click Add
  9. The next screen allows one to enter the text in edit mode:

    Page for setting up Pier.
    !Persistence
    *persistence|embedded=true*
    !User Management
    *users|embedded=true*

    Clicking 'Save' should bring up a page with dark red links for persistence and users:

    Pier
Page for setting up Pier. Persistence: persistence, User Management: users
  10. Create persistence by clicking on the link. Instead of adding a page, choose: PRComponent and Add. In the next window choose PRPersistencySettings for the Component Class and save:
    Pier Persistence Component Class: PRPersistencySettings
    Now you can choose an option which automatically saves the image after a page change (namely 'Image Persistency').
    I allow storage of the wiki using the image file. I keep maxImages backups based on namePrefix.
  11. Create the user component by selecting PRComponent and then PUUsersWidget when clicking on the link.
  12. Create the blog - this is required for exporting to code when upgrading. Goto the address http://localhost:8080/pier/ and select Add, provide a name like testblog and select PBBlog for the type. Select save on the following window describing the blog.
  13. Add Google Analytics for tracking:
    1. Create your account on https://google.com/analytics, find the Tracking Id under the admin page, it generally has the format UA-number-1.
    2. Under http://localhost:8080/pier/template/footer, login if so the edit option is available. In the editor add the text:

      *../Google Analytics|embedded=true*

      A picture:

      Powered by Seaside, add Google
      Click on the red link to create it, select PRComponent for the type, PRGoogleAnalyticsWidget (under Pier Widgets) for the component class, then save. The Google Analytics will look like a blank page, but if one clicks edit the following opens:
      Google Analytics bold, checked Views and Anonymousmous Users
      Enter the uacct. Normally I check the 'Anonymous User' option because I don't need to track myself. Logout of your page, and view the source (under Develop/View Source for Safari). There should be a ga function in the head with your account number.
  14. Next open http://localhost:8080/config/config, notice that no authentication is required. From the config menu, a lot of damage could be done to the seaside application so it should be secured:
    1. On this config page under Inherited Configuration -> Possible parents: select WAAuthConfiguration and click Add.
    2. The page should refresh. Under config enter a password for the admin account:
      Authentication Login admin
      Scroll to the bottom of the page and click apply.

    3. Port 80 is the normal port for webpages. In the Pharo window, click to open the tools menu and select Seaside Control Panel:
      Pharo Tools Seaside Control Panel
      In the control panel, select browse to open an inspector:
      a ZnZincServerAdaptor on port 8080
      In the bottom pane of the inspector (where it says "a ZnZincServerAdaptor..." self), change it to say:

      self port: 80

      and press Control-d, the port number in the upper pane should change to 80.

      In the Seaside Control Panel stop and restart the ZnZincServer so it is listening on port 80.

    4. In the Pharo window, click to open the world menu and select Save and Quit.
    5. Create a tar file of the following from the command line:

      tar -czf pier.tgz files pier.image pier.changes transactions.txt

      Details:

      • The pier.tgz is the new archive
      • The directory files containing the static content, particularly the CSS files
      • The pair pier.image and pier.changes contains the objects and source code, it's best to keep these together
      • The file transactions.txt is updated with each wiki update, this should be checked when the VM crashes

    6. Install Pharo on EC2

      1. Create an AWS account
      2. In the web console, choose Launch Instance
      3. Enter Ubuntu in the search field, choose the newest LTS that is free-tier-eligible, all of the defaults are generally acceptable
      4. Just as an extra security option, I normally update the security group to allow ssh only from my IP in the Security Groups
      5. Also in the Security Groups, add a rule to allow anyone to connect via HTTP (on port 80):
        Edit Inbound Rule - HTTP Traffic
      6. Open the EC2 Dashboard in the Console, find the IPv4 Public IP
      7. Ssh to the IP using the pem file: ssh -i ~/.ssh/ec*.pem ubuntu@3.18....
      8. Once connected, create a directory and install Pharo similar to the first step:
        ubuntu@ip-172-31-46-#:~$ mkdir Pharo
        ubuntu@ip-172-31-46-#:~$ cd $_
        ubuntu@ip-172-31-46-#:~/Pharo$ sudo apt-get install unzip
        ubuntu@ip-172-31-46-#:~/Pharo$ curl -L https://get.pharo.org/64 | bash
      9. Copy in the Pier archive that was created earlier: scp -i ~/.ssh/ec*.pem pier.tgz ubuntu@3.18.109...:Pharo/
      10. Unzip the archive on the EC2 machine: ubuntu@ip-172-31-46-#:~/Pharo$ tar -xzf pier.tgz
      11. Start the Pier image as root (since it listens on port 80): ubuntu@ip-172-31-46-#:~/Pharo$ sudo ./pharo-ui -nodisplay pier_on_ec2.image --no-quit

    7. At this point, the web site is public:
      Pier up with no CSS
      Note that the wiki appears without any CSS. A long-term way to fix this is to setup the development environment so it has the same path as on the EC2 machine (create an ubuntu user on your computer). A quicker way to fix the problem is to create a new CSS file:
      1. Click on the Templates link, select add at the bottom of the page (one needs to be logged in to see it). Create a PRFile this time:
        Create ec2Site.css
        In the next window, click Browse to choose an CSS file:
        Browse and Upload
        The file style.css can be found under files, or here.

        Also be sure to click upload, then save.

      2. Remove template and the session text from the address bar to return to the root page. Click settings and change the Style Sheet: from /template/style.css to /template/new_css_name, like /template/ec2Site.css in the example above:
        Pier Settings
        The Choose button also lets one browse Pier. After saving, the site should appear correctly.
      3. The image should save with these changes after a few hours. If one is impatient, then under System/Persistency this is a snapshot button.
    8. In order to have the wiki consistenly up, it works well to have it started through cron, an example script is here.

    Posted by John Borden at 4 November 2019, 2:54 am with tags Pier, Pharo link