From zero to a running preview in almost no time!
In this guide, we’ll show you everything you need to do to get automated previews for your software project.
Go to app.wunderpreview.com and log in with your GitHub account.
You will see an almost empty dashboard with a link called "Add new organization".
Click the "Add new organization" link and you’ll be directed to GitHub where you can select the GitHub organization and the repositories you want to connect to WunderPreview.
When you’ve finished selecting your repositories you will be redirected back to WunderPreview. There you’ll see your dashboard with your GitHub organizations and the list of connected repositories:
In your WunderPreview dashboard you can see your connected repositories.
The first time you click on a repository you’ll need to "enable" it. This will allow our WunderPreview Bot to post links to your previews into your pull requests (more on the WunderPreview Bot further down).
When you select one of your enabled repositories you will get a list of the recently updated pull requests. This is where you access your previews and their logs and also see the status of all your previews.
For every pull request you can see when it was last updated and by whom.
Additionally, you can see the status of the preview. This will tell you if the preview is running, currently building or if an error occurred during the build. The first status a preview has is "Not running".
On the right side you have two controls "Show Logs" and "Preview".
Preview: If your preview is already running, this button will bring you to your running preview! The first time you click this button will start the build process of your preview.
Show Logs: This opens the log viewer of your preview system (more on the log viewer below).
When you enable a repository in WunderPreview it will receive links to the preview URLs right there in the pull requests on GitHub.
Whenever you push to your pull request the comment will be updated so you always have the link to the latest preview.
You will also get a list of all the previews for this pull request, so it is easy to compare different commits of the pull request.
We have two kinds of logs in our log viewer: the "Build Log" and the "Service Log".
Build Log: The log that is generated when building your preview container.
Service Log: All messages your project prints to standard output and/or standard error.
By default, WunderPreview tries to connect to your project via port
8000. If your project is running on a different port you’ll get an error:
Change the port in the repositories settings. Just click the "Change Port in Settings" button to go to your repositories settings.
In the WunderPreview Dashboard you can get to the repositories' setting by clicking the small cog on the right side of the list of repositories:
The settings screen of your repository look something like this:
Here you can change various things:
Enable WunderPreview: This enables or disables your repository in WunderPreview. Only enabled repositories will have previews and receive preview links in their pull requests on GitHub.
Require authentication: If this setting is enabled, all visitors of your preview link will be asked to authenticate with their GitHub account. Only members of your GitHub organization with access to this repository can view your preview.
If this is setting is disabled everyone with the link can view your preview.
This setting is enabled by default for all private GitHub repositories.
Port: The port your project is running on. The default is
Environment Variables: Here you can specify environment variables for your project.
During the build of your preview container, these environment variables are given as build arguments to the "docker build" command.
These environment variables are injected into the running preview, so they are also available during run-time of your preview.
All environment variables are saved in a encrypted file only your WunderPreview user has access to. We never print the environment variables in any of our log files.
There are some special environment variables like
Those variables are given as build argument to the "docker build" command and are also available during run-time of your preview.
That's all you need to set up WunderPreview and give your development team the power of automated previews!
Do you have any questions or remarks? Just send us an email to firstname.lastname@example.org. We are happy to hear from you!