A Very Simple Tip To Make Episerver Development Easier

This is a very quick and simple tip.  If you work with clients who are as unorganized as a lot of mine have been over the years, then you will often face the challenge of needing to start work on the website before the actual HTML is ready yet to integrate.  Over the past few months, I've been using a really simple trick to help speed up my development process which I thought I might share.....  by adding a simple debugging ID into my base block controller.  

Historically, when I found myself needing to start building a few blocks without a design, I'd add a text property in the block, go into the editor, add some 'Lorum Ipsum' text into the text field and publish it.  On my webpage, I'd usually have a very white website, with some random text here and there.  Even though the time is pretty minimal, it all adds up.  Recently, I've been using this approach on all my most recent projects and it's been working pretty well. In my Base View Model, I've added a simple public Debug Id and class

public class BlockViewModel : IBlockViewModel where T : BlockData
    {
        public BlockViewModel(T currentBlock,
                              string displayOptionTag)
        {
            CurrentBlock = currentBlock;
        }
        
        internal string DisplayOptionTag { get; }

        public T CurrentBlock { get; }

        public string DebugId => $"{CurrentBlock.GetType()} {(CurrentBlock as IContent).ContentLink.ID} {DisplayOptionTag}";

public string DebugCode => $"<div class="Red">{DebugId }</div>";
}

The snippet's really simple and in no way ground-breaking.  From memory, I can't think of seeing anyone use it before though.  In my solution, all blocks use a controller (for caching purposes later on) and they all pass a view model back to the view.  The view model inherits from a single base view model.  I use a base view model to lump global properties togther, which this Debug ID fits into. As you can see, the code simply adds the content type, the current content ID and the display option tag into a single string (assuming you are using display options).

In My Razor view, I can then use this snippet in my block, to very quickly have something I can use to start structuring my pages, without even needing to open up EPiserver, by using @Model.DebugCode .  I did warn you at the beginning this tip is very simple but it's saved me hours' worth of time so far... enjoy!

Jon D Jones

Software Architect, Programmer and Technologist Jon Jones is founder and CEO of London-based tech firm Digital Prompt. He has been working in the field for nearly a decade, specializing in new technologies and technical solution research in the web business. A passionate blogger by heart , speaker & consultant from England.. always on the hunt for the next challenge

Back to top