4elements, web design and consultancy

  1. Programming With Yii2: Using the Advanced Application Template

    Final product image
    What You'll Be Creating

    If you're asking, "What's Yii?" check out Introduction to the Yii Framework, which reviews the benefits of Yii and includes an overview of  Yii 2.0.

    In this Programming With Yii2 series, I'm guiding readers in use of the Yii2 Framework for PHP. As you begin to use Yii for real development, you may want to start your next project with its Advanced Application Template. Among other things, it provides integrated user management features as well as two applications, one for the consumer-facing front end and the other, an administrative back end.

    In this tutorial, I'll introduce you to the Yii2 Advanced Template and guide you through the basic setup and usage. While Programming With Yii2: Integrating User Registration explored implementing user management on top of the basic template with the Yii2 User extension, this tutorial will launch a new repository with the advanced template rather than continue examples on our basic Yii hello codebase. 

    Before we get started, please remember, I do try to participate in the discussions below. If you have a question or topic suggestion, please post a comment below or contact me on Twitter @reifman. You can also email me directly.

    If you noticed there's been a delay in this series, it's because I'm recently back from brain surgery. Thank you for your patience and support—it's nice to be writing again regularly, and I'm looking forward to continuing coverage of Yii2.

    How the Advanced Template Is Different

    The most useful reason to migrate to the advanced template is for its implementation of user management features such as sign-up, sign-in, sign-out and password resets.

    The advanced template also provides for multiple access trees for a larger web application. It has a front-end and back-end web application for end users and administrators. But, this could also be expanded—for example for moderators or a special API, though there are other ways to integrate these features in one application.

    Here's a chart showing the primary differences between the basic vanilla Yii and the advanced installation:

    Yii2 Advanced Template Comparison with Basic Template

    In my latest tutorials about the Yii2 User extension, I'm increasingly impressed with its feature set as an alternative to the advanced template. However, it can also be easily integrated to either installation.

    It's worth exploring the advanced template before you begin a major project. I'm about to help you do just that.

    Installing the Advanced Template

    Let's get started installing the advanced template with Yii2. We can follow the instructions at the advanced template project on GitHub.

    Updating Composer

    First, we'll ensure that composer has the packages it needs:

    Installing Yii With the Advanced Template

    Then, we can install Yii with the advanced project template. We'll call our tutorial app yiiplus:

    Initializing Our Yii Application

    Now, let's initialize our application: 

    Prepare the Database

    Next, I'll use MAMP's installed version of PHPMyAdmin to create the database:

    create the database in PHPMyAdmin

    Click Create. Taking screenshots for the tutorial, I forgot to click create and then wondered why I wasn't able to migrate my database—it didn't exist yet.

    Next, edit /common/config/main-local.php to include your database settings:

    Then, you're ready to run the database migration to initialize your application. This primarily sets up the table for user management:

    Configuring Apache for the Front-End and Back-End Sites

    When we configure our development or production environment with the advanced template, we need to point the web server to a different root path, two actually. 

    First, we'll edit our hosts file to include frontend.dev and backend.dev:

    In my development environment with MAMP, I'll link my yiiplus directory to MAMP's htdocs:

    Then, I'll activate (uncomment) the include for virtual hosts:

    And configure paths for each of my server names:

    Once that's complete, here's what the front-end website will look like at http://frontend.dev:8888:

    Yii2 Advanced Template Front End Home Page

    The back-end site will request that you log in—it's for administrators:

    Yii2 Advanced Template Back End Home Page

    Exploring User Management

    Now I'm going to walk you through the basic user management features of the advanced template. But first we need to ensure we're receiving emails from Yii in our development environment.

    Configuring Email Delivery

    User management sends emails for password resets, so we need to activate Yii's SwiftMailer SMTP configuration. I'm going to use Mailtrap.io, which I explored in a prior tutorial, Introduction to Mailtrap: A Fake SMTP Server for Pre-Production Testing of Application Email.

    Mailtrap provides a fake SMTP server for your development team to test, view and share emails sent from the pre-production environments and test with real data without the risk of spamming real customers. For many development tasks, using Mailtrap will be free.

    Essentially, you sign up for Mailtrap and send all of your pre-production environment email via your fake Mailtrap SMTP server. Here's a short video overview of Mailtrap by Railsware:

    If you follow the tutorial and create a Mailtrap account, you'll see your demo inbox:

    The Mailtrap dashboard with your inboxes

    And, when you click on the Settings icon in the inbox list, you'll see that each Mailtrap inbox has its own SMTP server credentials:

    Mailtrap SMTP Server credentials

    With Yii, I'm updating the SwiftMailer SMTP settings in /common/config/main-local.php. Here's what it may look like:

    Note that if you do not customize the viewPath as shown above, you may run into a bug around the email template files not being found.

    Sign-Up and Registration

    Here's what the front-end registration screen looks like:

    Yii2 Advanced Application Template Sign up screen

    It will land you on the home page in signed-in state:

    Yii2 Advanced Application Template Signed in

    Sign-In

    Here's the sign-in screen:

    Yii2 Advanced Application Template Login

    Forgot Your Password

    And here's the Forgot Your Password screen:

    Yii2 Advanced Application Template Password Reset

    If you ask for a new password, you'll find it within Mailtrap:

    Yii2 Advanced Application Template Using MailTrap for SMTP

    What's Next?

    You may want to check out my Building Your Startup With PHP series, which uses Yii2's advanced template. Also, if you're interested in integrating this tutorial with Yii2 User, check out the guide to integrating Yii2 User with the advanced template and Google authentication (coming soon).

    I hope you've enjoyed learning about the Yii2 Advanced Application Template. I'd be curious to hear your feedback in the comments on whether you prefer it to the basic template.

    Watch for upcoming tutorials in my Programming With Yii2 series as I continue diving into different aspects of the framework. I welcome feature and topic requests. You can post them in the comments below or email me at my Lookahead Consulting website.

    If you'd like to know when the next Yii2 tutorial arrives, follow me @reifman on Twitter or check my instructor page. My instructor page will include all the articles from this series as soon as they are published. 

     

    0 Comments

    Leave a comment › Posted in: Daily

0 Comments

Got anything to add?

(Basic HTML is fine)