Using Komodo Edit to make Wt Applications

Introduction

This is my introduction in how to use the Wt C++ library using Komodo Edit with Wt and hopefully SOCI C++ to follow the tutorials on my YouTube page. I will also post a link to my Google drive to download the files so you can modify them to fit your setup. I have not tested them on another computer, so I hope this works and would welcome any feedback.

What do we need to do…

You need Komodo Edit, either version 8.5.3 or 10.1. I have tried version 9, but could not get it to work the way I wanted it to.

Next you will need CMake version 3.0 or greater, which will be used as a build system. I have used version 2.8 but I have not used it in a while, so try it at your own risk.

Then you will need these files from my Google drive: https://drive.google.com/file/d/0B4dOxRq21jw6RWVtVHJPZXRPYms/view?usp=sharing

You will also need 7z to be able to extract the files. Just do a Google search. The compression was much better than using a standard zip file.

The 7z file contains a standard Wt installation, in this case version 3.3.5. It also contains boost 1.57. All the binaries are already built using MinGW-64. MinGW-64 is also included in the 7z file, as well as SOCI C++. You do not have to use SOCI, but if you do use it, you will need some additional files, like MySQL.

The layout of the 7z is as follows:

Komodo

    CPP

        Build

        Product

        Source

            CMakeLists.txt

            Main.cpp

            SurpressGCCWarnings.h

        CMakeLists.txt

    SOCI

    Build

        Product

        Source

            Classes

            GCC

                SurpressGCCWarnings.h

            Libraries

                FindBoost.cmake

                FindSOCI.cmake

                FindWt.cmake

            CMakeLists.txt

            Main.cpp

        CMakeLists.txt

    Tokenizer

        Tokenizer.cpp

        Tokenizer.h

    Tools

        CleanBuild.bat

        Compile.bat

        Debug.bat

        Run.bat

        Server.bat

    Wt

        Build

        Product

        Source

            Classes

            GCC

                SurpressGCCWarnings.h

            Libraries

                FindBoost.cmake

                FindSOCI.cmake

                FindWt.cmake

            CMakeLists.txt

            Main.cpp

        CMakeLists.txt

    Wt Data

        Build

        Product

        Source

            Classes

            GCC

                SurpressGCCWarnings.h

            Libraries

                FindBoost.cmake

                FindSOCI.cmake

                FindWt.cmake

            CMakeLists.txt

            Main.cpp

        CMakeLists.txt

mingw64

    ...all mingw tools like compiler, debugger

SOCI

    ...SOCI C++ headers and libraries made by MinGW-64

wt

    boost

        ...Boost headers

    headers

        ...Wt headers and CMake files

    libs

        ...Boost 1.57 libraries and Wt 3.3.5 libraries

The layout looks intimidating, but it really is simple. The Komodo folder contains basic C++, Wt, and SOCI templates. The mingw folder contains the mingw compiler and debug tools. The SOCI folder contains SOCI C++, if you want to use it. The wt folder contains the Wt C++ installation using MinGW. Now that you see the layout of the environment, let’s make some changes.

First you need to install Komodo Edit. In my earlier videos I used version 8.5.3, but now I use version 10.1

Next you will need to install CMake. You can add to your system path but we will be adding to our path using Komodo Edit.

Start up Komodo Edit and go under Edit->Preferences->Environment. This will set your environment variables in Komodo Edit without having to do it in Windows. I am using Windows 7 and Window 2008 Server R2. It should work in later versions of Windows.

Now click the New… button to add a new environment variable. We will name it CMAKE. My default installation path was “C:\Program Files (x86)\CMake\bin”. Set it to your CMake install directory. This will tell Komodo Edit where to find CMake.

Next find the PATH environment variable and double-click it. It will add it to the User environment variable list. We want to override the PATH so Komodo Edit can see it. Add the path of the MinGW bin directories “C:\Environment\mingw64\i686-w64-mingw32\bin;C:\Environment\mingw64\bin;”. The Environment folder can be any folder you decided to extract the 7z file into. This allows Komodo Edit to find the make program and the MinGW gcc and g++ compilers as well as the linker and debugger. Click “OK” to save the changes. Click “OK” again to close the preferences dialog.

Next, if the right pane is not open, click on the right pane icon to open it. Then right click to bring up the context menu. Click on “Add”  and then “New Custom Toolbar”. When the dialog comes up, give the toolbar a name. I named mine “Build”. We will add the following toolbar items:

-       Clean Project (already discussed)

-       Compile

-       Debug

-       Run

-       Run CMake

-       Witty Server

Once you do this for one command, you can do it for all of them, including the project templates. Right click on the Build toolbar. Click on “Add Command”. When the dialog comes up, enter an new command name. The first one is called “Clean Project”. Click on “Change Icon…” and change the type of icons to “FamFamFam Silk Icons (1000). All the icons are listed alphabetically. Find the icon named “bin_empty”. Click “OK”. Now that adds our icon. Now in the Command dropdown box, you can either enter a batch command or a file to a batch command. We will add a file to a batch command. The batch files are part of the 7z file download. According to the layout, enter the path “C:\Environment\Komodo\Tools\CleanBuild.bat”. All the batch files are in the “Environment\Komodo\Tools” folder. The Environment folder is where I extracted my files, yours could be different. The path needs to be put in parentheses. Now click on the start in arrow icon (shortcuts) and click on the “%p : directory path of the active project file”. This enables to any batch file that is executed to be executed in the active open project. So we can clean projects, run make files, compile, debug, and so on in the active project file. All this is possible through Komodo Edit. We will keep the “Run in:” dropdown box the same of “Command Output Tab” so the output will be in the bottom pane. Then click “OK”. Don’t worry about how the batch file works.

We will add the following Komodo commands (Project Templates)

-       C++ Project (already discussed)

-       SOCI Project

-       Wt Data Project

-       Wt Project

You will repeat the same process for five more of these with some differences between two of them.

-       Command name: Compile, Debug, Run, Run CMake, Witty Server

-       Command: "C:\Environment\Komodo\Tools\Compile.bat", "C:\Environment\Komodo\Tools\Debug.bat", "C:\Environment\Komodo\Tools\Run.bat", “<different from the rest, see below>”, "C:\Environment\Komodo\Tools\Server.bat"

-       Start in: %p for all except “Run CMake” command. It should be %p/Build

-       Run in: Command Output Tab for all except for “Debug” and “Witty Server”. Those two should be set to New Console

-       Change Icon… for each of these are all in the “FamFamFam Silk Icons” unless noted. build, application_xp_terminal, play_green, disc-label (this is in “fugue icons”), browser_omniweb

*Now the Start in: dropdown box for “Run CMake” should be set to this command: cmake .. -G "MinGW Makefiles" -DCMAKE_BUILD_TYPE=Debug

The project templates are the same. Instead of a toolbar, right click on the right pane and click on “New Folder” and name it “Projects”. Right click on the Projects folder and click on add “New Command”. When the dialog comes up, enter a new command name. The first one is called “C++ Project”. Click on “Change Icon…” and change the type of icons to “FamFamFam Silk Icons (1000). This time find the icon named “application_add” and click “OK”. Now lets add a new command:

-       xcopy " C:\Environment\Komodo\CPP" /e

Again, the Environment folder is dependent upon where you extract the 7z file. The Start in: dropdown box value should be %p. The Run in: dropdown should stay the same, Command Output Tab. Click OK.

Again, you will repeat the same process for the same templates. The differences will only be the commands:

-       Command name: SOCI Project, Wt Data Project, Wt Project

-       Command: xcopy " C:\Environment\Komodo\SOCI" /e, xcopy " C:\Environment\Komodo\ Wt Data" /e, xcopy " C:\Environment\Komodo\ Wt" /e,

-       Start in: %p for all templates

-       Run in: Command Output Tab for all templates

-       Change Icon… for all templates is application_add under the “FamFamFam Silk Icons (1000)”.

For now you can ignore the SOCI Project template and Wt Data Project template, as I am still testing it out. I have just added them for your convenience.

I will also post a link to the YouTube video of how to add this setup as well. For now, most of my tutorials are focus on really basic elements of the Wt library and elements of C++. Check out my channel https://www.youtube.com/channel/UCV6i0irLVAgHRjd2PnWrj9Q . I think this will help people who need to see visually how to get started with Wt C++. This is the Windows version. Hopefully, I can do a Mac version when I have time. I have already tested it in Komodo Edit 8.5.3 on Mac OS X. The installation is similar but I have not tried it with Komodo 10.1 yet.

Rafael