What do I need to learn to build interfaces similar to LucidChart

There's draw.io, a very similar tool, but with the source on github.

To build such a rich user interface is a big task.Which is why there are lots of frameworks and libraries which have already developed rich user interface stuff such as:

• Sproutcore
• Cappuccino
• ExtJS
• Dojo
• jQuery UI

Sproutcore and Cappuccino are for developing desktop style applications for the web and include very good user interface components. As well as maintaing application states and data models. ExtJS has a lot of these features and a very nice UI toolkit, as does Dojo.

Lucidchart I notice uses the Canvas drawing API as well so thats something you would need to look into for shape manipulation and creating flexible connections. Mozilla Developer Center has some good stuff on the canvas API.

I would start off by taking a look at the Raphael library.

It allows you to write pretty simple Javascript code to draw graphic elements in the browser, including pretty straightforward animations and draggable/clickable interfaces.

In all honesty, it's not going to be quick and easy to write something as complex as the site you linked to, but Raphael is the quickest way to get started with the basics.

And best of all, Raphael is even compatible with older versions of IE, so you don't have to worry about only being able to support the latest browsers (though of course you may want to do other stuff that does need other new features).

Hope that helps.