Getting Started

Meet Nette Framework and create your first application.

The very first thing you should do is check if your server satisfies the requirements of Nette Framework. It should most likely be fine, but just to be sure we won't start with broken environment.

You can download Nette Framework manually, but the recommended way of starting a new project is using Composer. If you don't know Composer, you should definitely start with that. It's really simple and useful tool, check out their documentation.

With Composer, you can download and install the application skeleton known as Web Project including Nette Framework very easily. To do so, find your web root directory (e.g. /var/www or C:\InetPub) in your command line and execute the following command:

composer create-project nette/web-project nette-blog

Web Project will be downloaded into nette-blog directory.

If you couldn't use Composer, download and extract the archive and copy it to root directory of web server and rename to nette-blog. The entire framework is located in the vendor folder.

If you're developing on Mac OS X or Linux (or any other Unix based system), you need to configure write privileges to the web server.

cd nette-blog && chmod -R a+rw temp log

On some Linux systems (Fedora, CentOS, …), SELinux may be enabled by default. You may need to update SELinux policies, or set paths of temp and log directories with correct SELinux security context.

The Welcome Page

At this moment, the welcome page of the Web Project should be running. Try it by opening your browser and going to the following URL:

http://localhost/nette-blog/www/

and you should see the Nette Framework welcome page:

The application works and you can now start making changes to it.

Web Project's Content

Web Project has the following structure:

www/                      ← web root directory
└── nette-blog/
    ├── app/              ← application directory
    │   ├── config/       ← configuration files
    │   ├── presenters/   ← presenter classes
    │   │   └── templates/← templates
    │   ├── router/       ← configuration of URL addresses
    │   └── bootstrap.php ← boot file
    ├── log/              ← here you can find error message logs
    ├── temp/             ← place for temporary files (cache, sessions, etc.)
    │
    ├── vendor/           ← libraries for your application
    │   └── nette/        ← like your favorite framework :-)
    │
    └── www/              ← local web root - this is the only directory accessible from the web

Directory www is supposed to store images, JavaScript, CSS, and other publicly available files. This is the only directory directly accessible from the browser, so you can point the root directory of your web server here (you can configure it in Apache, but let’s do it later as it’s not important right now).

The most important directory for you is app/. You can find bootstrap.php file there, which loads the framework and configures the application. It activates autoloading and sets up the debugger and routes.

Cleanup

The Web Project contains welcome page, which we can remove – feel free to delete the app/presenters/templates/Homepage/default.latte file and replace it with text “Hello world!”.

Tracy (debugger)

An extremely important tool for development is a debugger called Tracy. Try to make some errors in your app/presenters/HomepagePresenter.php file (e.g. remove a letter from the word class in code) and see what happens. A red-screen page will pop up with understandable error description.

debugger screen

Tracy will significantly help you while hunting down errors. Also note the floating Debugger bar in the bottom right corner, which informs you about important runtime data.

In the production mode, Tracy is, of course, disabled and does not reveal any sensitive information. All error are saved into log/ directory instead. Just try it out. In app/bootstrap.php, find the following piece of code, uncomment the line and change the method call parameter to false, so it looks like this:

$configurator->setDebugMode(false);
$configurator->enableTracy(__DIR__ . '/../log');

After refreshing the web page, the red-screen page will be replaced with user-friendly message:

error screen

Now look into the log/ directory. You can find the error log there (in exception.log file) and also the page with error message (saved in an HTML file with name starting with exception).

Comment line // $configurator->setDebugMode(false); again. Tracy automatically enables debug mode on localhost environment and disables it elsewhere.

Now, we can fix the bug and continue designing our application.