Posts

Showing posts with the label development

jQuery style switcher

It's often the case that you want to provide more than one CSS stylesheet for your app or website. You can do this by including a style switching function in your app. Here's how to do it in jQuery. The solution uses jStorage to store the user's preference between sessions, but you could use cookies instead. Here is the jQuery: $(document).ready(function () {     var myStyle = $.jStorage.get('myStyle', '');     if (myStyle !== '') {         $("#colors").attr("href", myStyle);     }     $('.styleswitch').on('click', function () {         $("#colors").attr("href", $(this).attr('resource'));         $.jStorage.set('myStyle', $(this).attr('resource'), { TTL: 28800000 });         return false;     }); }); Here is the HTML in the <head> section: <link rel="stylesheet" type="text/css" href="css/colors.css" id="colors"/> And h...

Angular promises

Image
I have been struggling to understand Angular promises for months, and I finally found an answer on Stack Overflow that explains them really well. There's also this really helpful cartoon which has a nice story explaining the fetching of data . However, the Stack Overflow answer was what really did it for me, and fully deserves its current status of 383 upvotes. The problem The problem that promises set out to solve is that when you make asynchronous calls to a server where the results of one call are dependent on another call, you need to return the results in the order of your dependencies, not in the random order that will happen depending on which server call returns its results first. Example Say I have a page where users can subscribe to or unsubscribe from email mailing lists and RSS feeds. The data displayed on the page is an amalgam of two different services fetching data from two different servers. The unsubscribe action and the subscribe action both send calls to the se...

AngularJS style switcher

It's often the case that you want to provide more than one CSS stylesheet for your app or website. You can do this by including a style switching function in your app. Here's how to do it in AngularJS. In the HTML, create a button for each stylesheet that you want to switch between, and pass in the filename of the stylesheet as a variable: <button ng-click="changeStyle('colors.css')" id="pink">Brookes Pink</button><br /> <button ng-click="changeStyle('colors-lime.css')" id="lime">Brookes Lime</button><br /> <button ng-click="changeStyle('colors-muted.css')" id="muted">Muted colours</button><br /> <button ng-click="changeStyle('colors-dark.css')" id="dark">Dark colours</button> You will also need to put the ng-app attribute in the <html> element, and an angular variable in the path to...

Useful websites for developers

There are some amazing learning resources on the web, in every area of development, design, mobile, responsive, UX, and more. Here are some of my favourites. 24 ways The advent calendar for web geeks. For twenty-four days each December they publish a daily dose of web design and development goodness to bring everyone a little Christmas cheer. A List Apart Explores the design, development, and meaning of web content, with a special focus on web standards and best practices. The Agile Manifesto The core ideas and principles behind agile development. CSS Tricks Nifty things you can do with CSS, like making interesting shapes, or speech bubbles, or pull-out quotes. Meyerweb.com The website and blog of Eric Meyer, CSS guru and web consultant. Boagworld The website and blog of Paul Boag, user experience guru and web consultant.

Useful tools for developers

There are some amazing tools available for developers on the web, from pretty-printing your code to validating it, from colour palettes for visual impairments to tools for testing APIs. Here are some of my favourites. Stack Overflow This is the go-to site for questions and answers about coding. It has questions and answers on just about every programming language that you can think of - PHP, Python, Java, Ruby, JavaScript, jQuery, Angular, and more. And every environment you can think of - Windows, iOS, Android, and so on. And every mark-up and styling language - HTML, XML, CSS, and Sass. Stack Overflow has an awesome community of people willing to help complete strangers, which I think is amazing. I have learnt so much from reading Stack Overflow, and I haven't asked that many questions on there, because many of the common questions have already been asked and answered. User Experience This is the equivalent site to Stack Overflow for asking user experience questions (usability an...