A Very Simple Tip To Make Episerver Development Easier

When you work on a project, 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.....  so read on to find out more.  

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 boring, vanilla white webpage, 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, my preference is to use an explicit controller for all my block renderings, mainly so I have more controller over caching times/options, so anytime I render a block I'll always pass a view-model back to a view. 

The view model inherits from a single base view model.  I use a base view model to lump global properties together, 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!

submit to reddit

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