Posts Tagged ‘tutorials’

13 May 2016
2

My 2 webinars on Optimus XPages: An explosion of techniques and best practices

I’m happy to announce that both my webinar presentations titled “Optimus XPages” are available for viewing.

Overview

The first part focuses on techniques and best practices on a high level, where most of the video is presentation slides with a few short demos at the end.

The second video is a lot more fast-past. Nearly the entire video is live code. I pretty much design an XPages Single Page App from start with explanations of what’s happening along the way.

You can delve straight into Part 2, but I do recommend watching Part 1 if you have another 1.5 hours to spare, as it really gives some great insight to how apps should be developed.

Optimus XPages – Part 1: An Explosion of Techniques and Best Practices

Optimus XPages – Part 2: The Deep Dive

Closing

I trust you will get great value-add out of these videos. I just want to thank TLCC and Teamstudio for giving me the opportunity to present.

See you on the other side :)
John
17 Sep 2015
0

User Group Update: A rename & an identity. We’re getting there!

Things are getting exciting!!! We have renamed our local User Group and finally have some branding.

SALUG is now AfriTUG

We thought long and hard about this one, but it was ultimately decided that we needed a name that encompasses not just South Africa, but Africa as a whole. Also thanks to IBM Bluemix, we don’t want the focus of the User Group only on Enterprise Social Software (aka XPagesConnections, etc.), but also on the exciting technologies that Bluemix offers.

So without any further adieu, we give you…

AFRITUG-Meetup-Banner-Web

Our new look

To celebrate this rename, we now officially have a logo. This is thanks to a great design team by the name of Gist Marketing. Check out below some great examples of what we have so far:

AFRITUG-Icon-web

AFRITUG-Logo-No-Slogan-Protrait-web

AFRITUG-Logo-Full-Landscape-web

Where to find us

For the meantime, you can find AfriTUG on the following social sites:

Twitter

Facebook

Meetup

We have a very exciting roadmap ahead for this community and are committed to progress as rapidly as humanly possible, so stay tuned!!!

John

 

26 Jun 2015
3

Video Tutorial: Bootstrap Datepicker in XPages – Part 2

In this video tutorial, I demo how to modify the bootstrap date-picker that I introduced in Part 1, to be rendered as an inline date-picker instead of a popup.

Below is the URL to access the online date-picker sandbox dashboard, which is a great service to assist setting up the date-picker control:

Datepicker for Bootstrap Sandbox

Once again, a massive thanks to Mr David Leedy for presenting my video tutorials on NotesIn9, and for also making the NotesIn9 series freely available to the public. I know he spends his personal time getting out these videos and I know I speak for the entire community that it’s forever appreciated!!

Enjoy :)
John
25 Jun 2015
5

Video Tutorial: Bootstrap Datepicker in XPages – Part 1

In this video tutorial, I demo how to include a bootstrap date-picker into an XPages application that’s using the Twitter Bootstrap framework.

Below is the URL to access the online date-picker sandbox dashboard, which is a great service to assist setting up your date-picker control:

Datepicker for Bootstrap Sandbox

The following is the code to create the Bootstrap Resources custom control (ccBootstrapResources), which will reference the necessary Twitter Bootstrap and jQuery files via CDN services:

<xp:view
	xmlns:xp="http://www.ibm.com/xsp/core">
	<xp:this.resources>
		<xp:script
			src="https://code.jquery.com/jquery-1.11.3.min.js"
			clientSide="true">
		</xp:script>
		<xp:script
			src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"
			clientSide="true">
		</xp:script>
		<xp:styleSheet
			href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
		</xp:styleSheet>
	</xp:this.resources>
</xp:view>

The following is the code to create the Datepicker Resources custom control (ccDatePickerResources), which will reference the necessary Bootstrap Datepicker files that need to be added to the XPages design in the Web Content folder:

<xp:view
	xmlns:xp="http://www.ibm.com/xsp/core">
	<xp:this.resources>
		<xp:script
			src="bootstrap-datepicker/js/bootstrap-datepicker.min.js"
			clientSide="true">
		</xp:script>
		<xp:styleSheet
			href="bootstrap-datepicker/css/bootstrap-datepicker3.min.css">
		</xp:styleSheet>
	</xp:this.resources>
</xp:view>

A special thanks to Mr David Leedy for presenting my video tutorial on NotesIn9.

Enjoy :)
John
24 Jun 2015
3

Video Tutorial: Bootstrap-style your XPages Pager control

In this video, I show you how to easily bootstrap-style the XPages Pager control in your app without needing to reference Twitter Bootstrap resources.

Thanks to 2 XSnippets i’ve published on OpenNTF, to implement this functionality is as easy as copy and paste. You can reference the 2 XSnippets using the below links:

OpenNTF XSnippet: Twitter Bootstrap Pager Template

OpenNTF XSnippet: Twitter Bootstrap Pager Template Stylesheet

Click here to reference Twitter Bootstrap’s Pagination Control:

A special thanks to Mr David Leedy for presenting my video tutorial on NotesIn9.

Enjoy :)
John