All posts by Norik Davtian

If you are building a fairly complex web application, there is a high probability that you will have a lot of JavaScript code, and you would want to organize your code in some modular way that will be easier to maintain. Also at the same time you would also want to use some sort of a framework to simplify the process for you. But before getting there, let’s talk about how we got here at first place. In this video Robin Ward, co-founder of Discourse, talks about browser applications.

Building a fairly complex web application needs a very careful planning. Not just at the application level, but also at maintainability and efficiency level. Even if you are going to be the only person that’s going to work and maintain the code for a foreseeable future. Here are 9 things I thought you should know after creating your Hello World application and before creating your next application using Ember, especially if you are going to use Ember Data as your persistence library. Due to readers request, here is the code.

DemoDownload Source

Continue Reading 9 Things you should know before starting your next Ember.js and Ember Data application

We occasionally receive emails from our visitors with a specific question that we can refer to an article or section of a page on our website. However, with our lengthy articles, often times we find it frustrating to direct the user to a page with few lines of instructions. This is where anchor tags come in for the help. We decided to manipulate the content and add anchor tags to all our H2 tags.

Here is a feature that we thought is missing in WordPress

Add this code in your functions.php file and all your H2 tags will get an id attributes. Here we use WordPress’s built in sanitize_title_with_dashes function that’s used for creating permalinks when you type in your new post title.

// This function adds nice anchor with id attribute to our h2 tags for reference
// @link: http://www.w3.org/TR/html4/struct/links.html#h-12.2.3

function anchor_content_h2($content) {

    // Pattern that we want to match
    $pattern = '/<h2>(.*?)</h2>/';

    // now run the pattern and callback function on content
    // and process it through a function that replaces the title with an id 
    $content = preg_replace_callback($pattern, function ($matches) {
                $title = $matches[1];
                $slug = sanitize_title_with_dashes($title);
                return '<h2 id="' . $slug . '">' . $title . '</h2>';
            }, $content);
    return $content;
}

add_filter('the_content', 'anchor_content_h2');

And there we have our anchor tags. Now we can link to specific sections of our website like How to overwrite a CSS rule. Add some smooth scrolling if you desire, and you will have an impressive and user friendly website.

Why this feature is not a default in WordPress you ask?

Well, according to W3C Recommentatin for anchor tags, you can not have id attributes declare the same name twice in the same document. And since these elements are coming from the content editor generated by the user, there is no way to produce a valid markup if users use the same sub headings in the same post.

In this tutorial, we will explore business analysis and the essentials to write our first software requirements document. Taking an idea to the next level requires a little bit of planning. This is the planning phase of our web application development, also known as Requirements Engineering phase. If you are an entrepreneur, and would like to bridge the gap to development and software engineering world, this is that bridge. In this and next tutorial we will create a requirements document based on IEEE Recommended Practice for Software Requirements Specifications. We will start a basic requirements document for an online education and training app to be used as an employee training application for our imaginary client or prospects that we might be interested to sell this application to later on. We will build more on these requirements as we proceed with later versions of our application.

We started these web application tutorial series with an introduction to web apps and a very basic AJAX CRUD tutorial based on Zend Framework 2. However, our goal is to start developing complex web applications that could do more than just a simple create, read, update, and delete functions. Therefore, let’s start exploring what our application should do, and let’s start developing our initial requirements document. Continue Reading Start with an Idea and do the Business Analysis – Web Application Tutorial Series

So you want to start developing your very first web application? You want to know how you can start quickly and develop your first web application? Well here is the good news, you are at the right place. With these web app development tutorial series we are here to guide you through the development of your first web application and more. But, there are few points before we start. First, we have to mention that these tutorial series are meant for more technical audience with prior web design and development experience. Second, there are different approaches to even developing a simple application. You can copy and paste some code together and call it a success, or take a stricter engineering approach and build a code base that would have test cases, easily extendable, or even scalable for future versions, should you decide to build more features on your existing architecture. In this tutorial series we are going to develop a very simple web application, and build more and more on the same code. Because in real life that’s how software evolves. We will also cover some methodologies and software engineering concepts such as Rapid Application Development (RAD), and Continuous Integration (CI), and many more techniques and best practices that would help you with developing more complex systems. We tried to keep these methodologies separate from the coding tutorial sections, so people familiar with the methodologies could jump straight to the code.
So let’s get started with the concept first, and what you should know before starting your very first and simple web application.
Continue Reading How to build your first web application – Tutorial series

Food Web Application

You have designed the perfect layout for your new and upcoming website. But now converting all that beautiful Photoshop PSD layered file into a pixel perfect code is the challenging part. It is not challenging because you don’t know how to code, but more challenging because different browsers render your code differently, even when you are using a completely valid CSS code to display that awesome semantic HTML5 code you have written. This is even more frustrating when fixing a bug in one browser now becomes a new bug in another browser. Even if that’s not challenging, now imagine you are assigned to fix someone else’s code that’s all over the place. Often time this last case is the one that makes you pull your hair and say numerous WTFs before you completely understand what is going on in their code, because you probably know your entire style sheet by heart and this new code is no where close to any coding convention. However, moment of getting down and dirty with debugging that CSS code is much simpler and less frustrating than before, thanks to these very simple tools and techniques.

Continue Reading 4 simple techniques to quickly debug and fix your CSS code in almost any browser

You wanted to start a website. You asked your more tech savvy friend for help, or just searched on Google and found some articles that all talk about using WordPress as a starting point for creating your website. But…

Do you know why they tell you to use WordPress?

Or even if this was your choice and you would like to know if you have made the right choice to build your website on WordPress read on.

Continue Reading Somebody told you to use WordPress for your website, but do you know why?

Hello World!

In programing world, Hello World is the most basic example piece of code to see if the programing environment is working or not. And here we start our first blog post. We are live, finally.

YES! It Works.

I am very excited to announce that starting today, this website will be a place for us to share and collaborate many interesting projects and articles with all our Web Engineering fans, and those who want to learn more about Web Engineering, development of Web applications, mobile apps, website design, user interfaces (UI), user experience (UX), patterns in Web Engineering, and anything above, under, and in between those.

What is Web Engineering?

You might ask, what is Web Engineering? is it different than Web Development? How about Web Design? Is it different than Web ____?

or even Software Engineering?

No, it is not that different. These are all relative terms, except the approach in Web Engineering is slightly different. In fact in Web Engineering, most of the approaches are systematic and similar to Software Engineering, but with more emphasis on development of products that rely on Web. Some may call it Software Engineering for the Web and the person that performs the task as Software Engineer in Web. We call it Web Engineering, and the person that performs the tasks as Web Engineer.

Here is a more concrete definition from a book with the same title “Web Engineering.”

Since its original inception back in 1989 the Web has changed into an environment where Web applications range from small-scale information dissemination applications, often developed by non-IT professionals, to large-scale, commercial, enterprise-planning and scheduling applications, developed by multidisciplinary teams of people with diverse skills and backgrounds and using cutting-edge, diverse technologies. As an engineering discipline, Web engineering must provide principles, methodologies and frameworks to help Web professionals and researchers develop applications and manage projects effectively.

And another one from a different book called “Web Engineering: The Discipline of Systematic Development of Web Applications”

Modern Web applications are fully-fledged, complex software systems, and in order to be successful their development must be thorough and systematic.

This book presents a new discipline called Web Engineering taking a rigorous interdisciplinary approach to the development of Web applications, covering Web development concepts, methods, tools and techniques. It highlights the need to examine and re-use the body of knowledge found within software engineering and demonstrates how to use that knowledge within the Web environment, putting emphasize on current practices, experiences and pitfalls.

There might be 100 other definitions out there, but at the core, it all boils down to the principles and the systematic approach to how a Web Engineer approaches solving a Web product, being a Web app, mobile Web app, a framework, a complex website, a simple website, or even a Web page. The list does not end there. Web Engineering approaches even extend to the components that work within Web pages, such as a piece of JavaScript plugin, or an Object Oriented approach to CSS. The list does not even end there either. It even extends to practices that have nothing to do with the actual code itself, such as project management, requirements engineering, test plans, code refactoring and documentation, risk analysis and disaster recovery of Web systems, and many many more practices mostly inherited from Software Engineering.

We do Web Engineering

After graduating with Software Engineering degrees from University of California, Irvine, our passion to develop websites led us to start our own company, Big Employee. Based on experience working on different projects and clients from variety of industries, we noticed that happy clients are often the ones that their projects complete on a timely basis and fast. (Well, not a huge discovery in an information age, where attention spans are the shortest in the mankind history.) Working collaboratively and simultaneously on the same project was the main reason for us to adapt this approach. It was out of necessity, but the gain in productivity and quality of the final product was very noticeable to the time when we were freelance web developers few years ago. Implying programming standards and best practices in our Web Engineering approach is the reason that professionals that have to maintain our code are glad for working with us.

At Big Employee, we love to challenge extends of our knowledge, or what has been done previously on the web. Thus, we face challenges that makes us search Google if any one had the same problem before, and if they have found a solution to that particular problem. Sadly there are times that we find no solution on the Web, and have to go back to the problem and craft our own solution. On the other hand, in most cases a forum link from Stack Overflow or some other forum, or a blog post related to that topic leads to the anticipated answer. Usually there are many people facing the same problem, however the proposed solution in that blog post is often not the best way of solving that problem. For example, we have seen solutions that suggest modifying core of the platform or framework, which might cause major problems with an automatic or even manual update to the framework. Although, this sometimes might be a good enough solution for many hobbyists and freelance developers out there, it may cause more problems later. What if some one has to pickup the code and continue working on it, or manipulate the results of that code and write another algorithm on top of a now slow algorithm found and implied from that blog post.

The reason we started this blog, we thought it will be a good resource to share some of our works, open source projects, and our expertise with other developers and whoever visits this website. We wanted to write about challenges we face during development of our project and how we solved it, so if someone else has the same problem will find our solution, as we often find solutions to some of the problems we face on other websites. Also, teaching is other passion of ours. We will post articles on how to create web applications, plugins, themes, interfaces, tips, tricks, or even business aspects of being a Web Engineering company, and may other related topics. I hope we learn something new from this journey, make new friends on the World Wild Web, and hope our articles be educational and amusing for our readers.

We are Open for Business

Lastly, we are open for business. If you have a project and would like to discuss, share an idea, request a tutorial, have a cup of coffee and get to know us, or just simply want to say hi , send us an email, or a tweet to @BigEmployee. We are looking forward to hear from you.

 

– Big Employee Team