Tagged with HTML5
It’s that time again. I’ve recently released a new course on Pluralsight. This time I tackle Web Development for complete beginners.
If you are a developer who wants to move from either back-end development or from desktop development to client-side web development, this course may be for you. The concept around the course is to get you up to speed with the very basics of web development in a short amount of time. In fact, in just over three hours, you should be able to get a basic understanding of web development.
After viewing my course, there are other courses that will take you through deeper knowledge of modern web development, but the basics is where you should probably start. In the course we cover the bare bones that you need including:
As many of you know, I have a new course with Pluralsight called "Building a Site with Bootstrap, AngularJS, ASP.NET, EF and Azure". I had the opportunity to use Zen Coding (renamed Emmet for some reason) in the course. We've released a snippet of the course on YouTube that shows off this cool productivity enhancement that Web Essentials powers. Caveat: Web Essentials doesn't work with free versions of Visual Studio.
NOTE: The title of the video is incorrect and we're trying to change it...it is about Zen coding.
UPDATE: It was noted that I misspelled it. It's Emmet not Emmit. I fixed it in the article, but I can't fix it in the title as that's my URL too.
I recently helped the Atlanta Code Camp effort by building them a new website. You can see it here: Atlanta Code Camp. I am pretty proud of what I was able to accomplish in the scant number of hours I had to build it. It's not done as we need to improve it when we have the speakers chosen and set up the schedule, but so far I am pretty happy with it.
I had a number of goals for the project:
My first thought was to start with a Mobile-First template and just build the site but as #4 was going to stymie that as PluralSight would really like me to finish my courses ;) So I started with a Bootstrap template (that I got from https://wrapbootstrap.com). This provided a good basis for the shell of the website. Before I did real color skinning of the site, I needed to wait for our logo. Dennis Estanislao did an amazing job on the logo. With that I was able to use the color scheme to change the template to match the logo and overall theme. But that was just the HTML part of the story.
After my recent talk on Mobile-First Design, one of the attendees tweeted that he thought it was ironic that my talk was on responsive design but my blog wasn't mobile-friendly. I told him that my company site was…but that was a cop-out. I hadn't had time to get the blog setup with a good template. So voila! I haven't confirmed that everything works the way I want but we should be close!
As some of you might not know, I don't use a blog engine (it's just a custom ASP.NET MVC site). What I love about ASP.NET MVC, is that since the markup so fairly separated from the code (I try and use as little actual Razor markup as possible), skinning it with a new Bootstrap template was pretty simple. It took me about 8 hours to convert it all.
Let me know what you think…
If you're interested in cross-platform mobile apps, I like the solution that PhoneGap has. It uses HTML5/CSS/JS as the UI stack and I find it compelling to build apps for iOS, Android, Kindle, Windows Phone and Windows 8 Store. I've just released a new course on PhoneGap that attempts to fill in some of the holes in building apps. The course includes:
Hope you enjoy the course. You can view it here:
I've created a new example of a PhoneGap app for my talk at the Atlanta Windows Apps meeting. The talk I did tonight didn't go all that well, but I got it working and the result is something you can download and see how to use a minimum of WinJS to build your Windows 8 apps.
The example PhoneGap app sourcecode can be found on GitHub:
Additionally, you can see the Win8 version by downloading the project I built during the talk:
One of the things that I’ve been spending a lot of time working with lately is the ability to be able to build cross-platform apps. While I spend a lot of time in the Microsoft space (especially Windows 8 and Windows Phone 8), I need to be able to create and deploy apps to iOS and Android platforms. I've decided to do a series on building one of these using Single Page Application for the web, then deploying it to devices via PhoneGap:
There are a number of solutions for cross platform apps (e.g. MonoTouch/Droid, et al.) The types of apps I am building are just consuming or displaying information from a standard web back-end (e.g. REST services). Because I typically need to build a responsive website for the solution as well, using a solution that could share some or all of it’s code with the website is a good match.
Using HTML5/JS/CSS to build apps isn’t perfect. Not all apps are a good candidate for this type of cross-device development, but I like to think that for many v1 apps, this is a laudable solution. In many cases, these apps are plenty functional for the life of the app, and in other cases it provides a fast-to-market solution so that a full native experience can be built after the app is initially launched and validates that it fills a market need (classic Minimum Viable Product strategy).
If you made it to build or spent much time watching the videos one of the stories many heard from Microsoft revolved about creating HTML5/JS applications for the Windows Phone 8. Unfortunately the story confused a lot of people (at least by the questions I've been getting lately.
Let me be clear...you *can* create HTML5/JS/CSS applications for Windows Phone 8. Yup. In fact, you could do it with Windows Phone 7 and 7.5. This is how PhoneGap works. The XAML page simply hosts a WebBrowser control and loads all of the assets locally in the XAP. What you can't do is create WinJS application. Let's step back a little and explain that better.
Windows 8 and Windows Phone 8 were both highly publicized releases this last week. One of the things that is not all that obvious to the casual observer is that the biggest change to Windows Phone 8 is that the underlying operating system now uses the same core as Windows RT (e.g. Windows 8 for ARM). In fact, the new phone SDK supports DirectX, C++ and creating WinRT components. All very cool.
I headed up to the Gwinnett .NET Users Group last night had we talked all about mobile web development using ASP.NET! If you were there, thanks for attending and here are the slides and code as promised!
If you had any questions that you didn’t get to ask at the talk, just comment below.
The course is broken up into four sections:
You can see the course here:
I had the pleasure of joining many of the Atlanta .NET community for the annual Atlanta Code Camp. If you didn't get a chance to join us, you missed a great time. The attendees were enthusiastic and friendly. Thanks to everyone who attended!
I promised the people who attended my sessions I'd post the slides and example code so here you are:
Mobile Web Development
I also got to discuss fried foods and make fun of Keith. Couldn't have been a better time. Go listen now:
I had the opportunity tonight to do a talk for the Atlanta XAML Meetup on Web Development for XAML Developers. I had fun explaining how XAML developers can use their existing skills with markup, design, data binding and data access on web page development. You can see the slides from the talk here:
If you’re interested in the code from the talk, you can get it here:
As you develop HTML apps, one of the issues you’ll face is that your application doesn’t come to the browser in one fell-swoop. A typical web page receives content from a number of sources. Below you can see the first bun of requests from a site (in this case MSNBC.com) as shown in Firebug:
This is the fourth of ten parts of this blog post. The topics will be:
I’ve had Visual Studio open constantly on a laptop for the better part of ten years (and fifteen if you count Visual C++). I am used to setting breakpoints inside of the Visual Studio editor and pressing F5 to see what is happening.
This is the third of ten parts of this blog post. The topics will be:
What’s Wrong with CSS?
If you’re going to do web development, you’ll need to learn how cascading style sheets (CSS) work. It’s a fine system for defining the look and feel of your designs but as a developer I find them more painful than necessary. Let’s discuss some of those pains.
I am excited to announce that I’ve refactored (and renamed) my web-centric training course. The old “ASP.NET MVC/HTML/CSS Workshop” was just too long. It’s now called “The Web Workshop”.
This is the second of ten parts. The topics will be:
For now, let’s segregate these two types of code into separate directories as shown below:
This is the first of ten parts of this blog post. The topics will be:
In the past year I’ve had a side project. FirstInked’s Beta recently shipped and I wanted to share with you what I’ve learned. To start out, I want to specifically thank two people who were really great in helping me formulate the strategies I’ll talk about. They are:
Where I Came From
I spent this week at Build and was interested in both the XAML and HTML/JS part of the Metro story. I am in the middle of converting GooNews into both HTML and XAML Metro apps to test out the new APIs.
I have to admit, I was nervous at first because this in the keynote:
I am headed to Build Windows next week and I have a lot of hopes for the conference. I haven’t been to a conference as an attendee alone in quite a long time. I am anxious to see what the v.Next is out of Redmond.
I didn’t get to go to the 2000 PDC that changed everything…so I really wanted to be here for this conference. Is this going to change everything again? I have no earthly idea but I hope for a mix of new and old.
Here is what will happen at Build if this were a perfect world:
I recently presented on HTML5 (with a sidebar on Silverlight's role in HTML5's world) at the Atlanta Microsoft Professionals' User Group (AMP). I promised them i'd share my slide deck from the talk. So here it is: