Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Dave ParadiseDave Paradise 

Additional Help Resources for Lightning Components Framework Specialist Superbadge

Hey team. While doing Trailhead modules I definitely found that Lightning Components are a huge weak point in my ability to fully grasp. As such I'm struggling to even get started on the Superbadge.

Are there additional resources outside of Trailhead that are available to try and help get a better grasp on the concepts? Thanks.
Best Answer chosen by Dave Paradise
Brian KesslerBrian Kessler
That's a very open question... 

Do you have any background developing websites?
If you haven't already, you should probably start by learning HTML, JavaScript, and CSS.

You'll find some great tutorials for getting started at:
* https://www.w3schools.com/
* http://www.tutorialspoint.com

If you want something more Lightnint Component specific, SFDC offers the Lightning Component Developer's Guide:
https://resources.docs.salesforce.com/sfdc/pdf/lightning.pdf

This contains a lot of good information, though sometimes feels as though one is reading a dictionary.

Unfortunately, I'm not aware of any 3rd party documentation on either Lightning or Aura, and documentation on the Aura framework seems to have disappeared since I looked at it several years ago (which was of limited utility when I last looked, anyway).
 

All Answers

Brian KesslerBrian Kessler
That's a very open question... 

Do you have any background developing websites?
If you haven't already, you should probably start by learning HTML, JavaScript, and CSS.

You'll find some great tutorials for getting started at:
* https://www.w3schools.com/
* http://www.tutorialspoint.com

If you want something more Lightnint Component specific, SFDC offers the Lightning Component Developer's Guide:
https://resources.docs.salesforce.com/sfdc/pdf/lightning.pdf

This contains a lot of good information, though sometimes feels as though one is reading a dictionary.

Unfortunately, I'm not aware of any 3rd party documentation on either Lightning or Aura, and documentation on the Aura framework seems to have disappeared since I looked at it several years ago (which was of limited utility when I last looked, anyway).
 
This was selected as the best answer
Dave ParadiseDave Paradise
Thanks, Brian.

I have experience with HTML and Java (but not JavaScript) so I can grasp how everything is put together, but the actual coding is proving to be the tricky part.
Brian KesslerBrian Kessler
Yeah, working with Lightning Components can be awkward, even (or perhaps especially) if you have a JavaScript background.
Contrary to anything SFDC may say on the topic, I actually sometimes feel like I'm working in some alternative, proprietary ECMAScript which has been crippled to hell and back again.  While other modern JavaScript frameworks are enabling developers to use ES6 and TypeScript, LockerService means we can't even use all of ES3.  And then there are some terrible naming conventions, and lack thereof...  And the tendency to define really noisy markup to get the styles right...

For me, the biggest difference between coding Java and coding JavaScript is that you don't need to (and can't) declare types in JavaScript, but everything is either an object or has an object wrapper (even functions are objects), so you can pass them around.  This, is incredibly useful and often necessary, but, of course, can lead to callback hell.   In ordinary JavaScript, one solution is to extract your functions, which you can nest into other functions to keep them private, however, this will oblitorate your enter Lightning Component and possibly even the Lightning App which contains it.  However, you can still extract the function if you either assign it to a variable or put it on the helper JSON...

But at this point, I'm mostly babbling since I don't know what problems I'm trying to solve.  Perhaps if you can more specifically describe some of the issues you are facing, we can get into more specific solutions.
Dave ParadiseDave Paradise
Mostly the naming conventions, noisy markup you mentioned, and not being able to find answers to dealing with those in the documentation. I'll hopefully find some answers in the one you linked and work it out bit by bit as time permits. The one thing that's driving me crazier than anything else can be considered trivial, but I find confusing in that Challenge 2 asks to place a 10px margin-botton on the BoatSearch.cmp component between the two components it contains. If it goes inside the lighting card wrapper, I can't find out the syntax for that. If it goes in the Style section, I can't find exactly what to put after the .THIS for it.

I'm actually shifting focus to some White Belt certifications and will resume this Superbadge after some more study and practice on the lightning components.

Thanks again for your help.

 
Brian KesslerBrian Kessler
Regarding the 10px margin-bottom, I suspect they may have been looking for us to use the Salesforce Lighting Design System (https://www.lightningdesignsystem.com/) (SLDS), which is really a PITA.  

I "fulfilled" this requirement with 
  
<lightning:card class="slds-m-bottom_x-small">

but that's technically not 10px ...
If I remember correctly, it was defined in rem and was therefore dependent upon font size.  I used an REM Calculator (https://offroadcode.com/rem-calculator/) and took the closest match.

Alternatively, I could have named my own class in the markup and defined it in the css.
For the most part, Lightning CSS is just standard CSS (not that CSS is always so easy), however you need to include .THIS to keep the styles from leaking into other components (or the page containing your app).  As a general rule, you probably want a space after .THIS unless you are stylizing the components outermost element other than aura:component itself...  But I haven't really mastered CSS so well, so there isn't so much I can tell you about it.  (Really, I prefer to avoid thinking about the UI and prefer backend, or backend-of-the-frontend, work).