Learning Resource Roundup 📚

Discussion
1

Hey folks!

In the spirit of continuous learning and collaboration, your friendly neighborhood Community Support Engineers over here at Retool have been thinking it could be really cool to pool together our favorite learning resources in one place!

And so - we pose this question to the community and eagerly await your thoughts!

:sparkles: How have you been continuing your learning journey to build skills and understanding that helps you build in Retool? :brain:

Answer this however you'd like -- anything that you think others could also learn from. Some prompt ideas to jump-start our learning resources thread:

  • Favorite online course you ever took that still helps you today?
  • Website or reference docs you always have open when building in Retool?
  • What kinds of technical concepts or skills have you focused on developing that have been the most high-leverage when translating to building in Retool?
    • JavaScript / SQL / sub-concepts of those?
    • DevOps concepts for self-hosting Retool?
    • Have you found resources for learning concepts and skills around the ever-evolving world of AI that have helped leverage AI features in Retool?
  • Product design or project management resources that help you organize your Retool building work?
  • Do you follow any cool tech blogs or other forums to learn adjacent things?
  • Think outside the box - any other learning tips or resources that other community members here could benefit from hearing about?

Please share your own list of websites, online courses, meetups, or other learning resources in the comments here!

Looking forward to learning alongside you all :rocket:

(We'll also cross-reference this thread for visibility in our current community challenge centered around all kinds of learning! :raised_hands: 🍎 September Retool Community Challenge: Back to School Edition📚 )

7 Likes
2

Great idea, Kayla!

  • Definitely not biased or anything, but I bookmarked the Environment Variables page in our docs a long time ago and have it open whenever I'm working with a self-hosted instance.
  • Google has a really cool playground for helping to understand and build OAuth2 integrations.
  • I still find CIDR notation to be not very intuitive, so this calculator comes in handy whenever I'm setting up cloud infrastructure.
4 Likes
3

JavaScript unlocks the full potential of Retool, enabling us to build highly dynamic and customized applications. It’s crucial for manipulating data on the fly, creating responsive, interactive components, and finding inventive workarounds that open the door to even more use cases.

Although AI can generate JavaScript, I find it essential to be comfortable with the language to effectively tailor the code to our specific use case and troubleshoot any issues that arise.

Eloquent JavaScript is a great book to master the language, and there is a free online version: https://eloquentjavascript.net/

I recommend the entire book, but to get the most out of it for building in Retool, focus on chapters 1-6 and 11.

Similarly, Retool applications interact with various types of resources, and most often, you'll be working with a relational database. To sharpen your SQL skills, I highly recommend going through SQL ZOO. it's a fun and engaging challenge!

6 Likes
4

Hi everyone,

I wish I had a bookmark folder full of resources to share, but in reality, this is all I have:

Here's a fun fact I suppose: I use ChatGPT the Mac Desktop App more than Retool's baked in AI (the little purple bot) because in Retool, the AI doesn't have context to the code it is manipulating.

For example: it generated this function from a prompt just fine, but if I ask it to modify it, you can see that it was not given the current code as context.
image
image

It became faster for me to use keyboard shortcuts to:
select all, switch to chatgpt, paste, ask, copy reply, switch back to retool, select all, paste

4 Likes
5

Much like above, I don't really have a folder of resources but I think something that has helped me approach my designs with a clear philosophy is the Mozilla Developer Network site for Javascript references.

It usually talks about the purpose of certain prototypical functions and gives clear examples of how they should be implemented.

Similarly, I am often referencing the built-in feature's source documentation (some already listed above like lodash) and learning some context specific nuance for using different query languages.

Probably the biggest resource I have to be successful, though, is here in the forums. I often don't have the same issues that others run into because of the scope of my development requirements, but seeing their issue often allows me to use my preferred resources to figure out how I would approach those problems. Other members are also providing their own solutions and in some cases revealing new ways to approach these problems. In providing a solution to a member in need, we are helping clear out issues that might help others (and ourselves) in the future.

5 Likes
6

LAST UPDATE: 10-2-24

This is bound to be THE goto thread to find learning sources coding and technical topics/concepts for all skill levels! Can't wait to see what everybody shares!

Note: I'll be updating this with more resources as I have time. I'll list dates I make updates at the bottom.

The Programmers "Bible"
------------
C++ Primer (5th Edition)

  • Ok so maybe I'm biased here :smirk: and this might seem odd considering none of the C languages are available to us.... directly. they aren't directly available to us. fun fact, javascript engines and interpreters are almost always built with c or c++ and python actually is built on c. that's why I say it isn't directly available, but we are influenced by it. this book contains EVERYTHING you could possibly do in c++, but most notably it includes the breakdown, use and re-creation of the programming fundamentals that are used in EVERY programming language.
  • Ignore the first 9 pages on chapter 1 and every thing else can be found in some way in every programming language (most can be found in scripting and query languages as well, markup languages are the only ones that get left out but only because they don't need it to perform their 1 purpose of embedding text)
  • :rofl: don't try reading it page by page front to back. I don't know a single person that has.... maybe a couple of my teachers, but those were people who found 1 improvement to 1 equation incressing its efficency by such a considerable amount Nintendo made the N64 Expansion Pack (it was 1 simplification that led to something like 15-20% improvement in speeds... it was 1 dude who found it and he wasn't even a math teach :sob:) . The Bell Curve was invented because of people like them, probably.

Javascript - Baics/Fundamentals
------------

  1. MDN (Mozilla Developer Network)

    • this is almost always my goto, especially if I know the function I'm looking for or even just a similar function name from another language like .length() or .substr() from C++ std::string

    • Frequently Referenced Pages while using Retool:

      1. Object and JSON Objects
        • Quick reference conversions to/from JSON String
        const my_json = "{'attr1':'test1'}"                      // typeof my_json === 'string'
const my_json_expected = { attr1: 'test1' }  // typeof my_json_expected === 'object'
const my_obj = { objAttr: true }                           // typeof my_obj === 'object'
const my_obj_expected = "{ 'objAttr': true }"  // typeof my_obj_expected === 'string'

// ***************************
// |  JSON String -> Object  |
// ***************************
const my_json_as_obj = JSON.parse(my_json)
assert(_.isEqual(my_json_as_obj, my_json_expected, "Objects should be equal");

// ***************************
// |  Object -> JSON String  |
// ***************************
const my_obj_as_json = JSON.stringify(my_obj)
assert(_.isEqual(my_obj_as_json, my_obj_expected, "Strings should be equal");
      2. String
      3. Array
      4. Date
      5. Error

  2. W3 Schools - JS

    • This site tends to leave out deep techy details, which can be a nice place to start when learning a new concept/fundamental.
    • On the plus side, it always has lots of examples with 'try it yourself' areas and there's usually an exercise of some sort to practice what you've learned in a test-type style

  3. StackOverflow - JS

    • This is usually where I end up looking to find something similar to what I need that I can easily modify for my needs

Javascript - Advanced Concepts
------------

  1. GeeksforGeeks
    * this is a big site and it covers the vast majority of everything you'll need (with anything that's missing being on MDN)

Javascript - Other Learning Materials
------------

  1. GeeksForGeeks - Free self-teaching roadmap for beginners

    • 6 Chapters, 39 Articles and 3 Quizes

  2. 33 JS Concepts Every Developer Should Know

    • It's so popular it's provided in 42 languages. I actually didn't even know there were atleast 42 languages until today. I thought like 20 max (guy math, divide by 3?), :rofl: not as bad as not know pickle = cuccumer but i feel like its up there.
    • Featured and recognized as one of the best projects on github (this, the algorithim one below this and 30secondsofcode were also recognized here)
    • Includes multipule links to articles, videos and occassionally books for each concept

  3. Javascript Algorithms

    • 100% my favorite here to randomly peruse :innocent:
    • its kinda self explanitory, but it contains probably every algo you'll need unless you're doing some really weird stuff like applying math operations from another arithmitic system (attempting to account for under/overflow in a finite number system using Modular Arithmetic.
      for the curious who don't wanna risk the chance of a migraine by clicking the wikipedia link: its how we are able to describe 24 hours with only 12 numbers... and now I think i can only get nerdier if I posted a picture of my c++ primer book as a Halloween costume

Javascript - Tools
------------

  1. 30secondsofcode - Snippet Collection

    • I'm not personally a big fan of snippets, the amount of time I spend trying to remember the abbreviation I find more productively spent just typing the 5-10 lines... that's within the context of VS Code though, on this site they're simple breakdowns of a process or concept and basic code example. Javascript, CSS, Python, Node.js, Functional Programming.... even topics like Data Structures (YAY), algorithims and

    Modeling money, currencies & exchange rates using JavaScript

  2. Bigocheatcheat - Time Complexity

    • need to improve some section of code or a more effecient way to store, sort or search data? go here, I can't remember time complexities except for some of the basic things and if I had to modify an algorithm (even just storing something for logs or whatever) can cause a loss of effecency by a noticable ammount when ran over 1mil items, but we're in math world right now using math terms so we want to know what happens when an infinite number of items is used... just how much can 1 statement change efficiency? enough for a user to think something froze, broke, or for them to turn A.D.D. and go back to Tik-Tok or to cause your screen to flicker at juuuuussssttt the right speed to make you sick :wink:

Python
--------

SQL / PostgreSQL
____________

Retool
--------

Programming Fundamentals
----------------------------------

Advance Programming Concepts
___________________________

UPDATES:

  • 9-27-24 - Created
    • Baics/Fundamentals
  • 10-2-24 - Updated JS and added 'Last Update' at top for quicker reference as post gets longer
    • The Programmers "Bible"
    • Advanced Concepts
    • Learning Materials
    • Tools
5 Likes
7

:student:

I wanted to share a fantastic resource that has really helped me on my web development journey: Web Skills. :books:

This collection covers a wide range of essential topics, from HTML and CSS basics to more advanced JavaScript frameworks. It’s been super useful for identifying the skills I need to focus on.

I love how it also dives into important areas like responsive design and APIs, which are crucial for building modern websites. The layout makes it easy to track my progress and see what I want to learn next.

Here are some key topics covered:

  • HTML/CSS: Foundational skills for building and styling web pages.
  • JavaScript: Essential for adding interactivity and functionality to websites.
  • Frameworks & Libraries: Insights into popular tools like React, Angular, and Vue.
  • Version Control: Understanding Git and GitHub for collaborative coding.
  • Responsive Design: Techniques to ensure websites work well on all devices.
  • APIs: Learning how to interact with and utilize various APIs.
  • Web Performance: Best practices for optimizing loading times and user experience.
  • Accessibility: Ensuring websites are usable for everyone, regardless of ability.
  • Web Components: Building reusable components for web applications.
  • Progressive Web Apps: Creating apps that provide a native-like experience on the web.
  • Build Tools: Streamlining the development process with tools like Webpack and Gulp.
  • Testing: Techniques for ensuring your code is reliable and bug-free.
  • Architecture and Paradigms: Understanding different approaches to building applications.
  • Team Collaboration: Best practices for working effectively in a team setting.
  • Design and UX: Creating user-friendly and visually appealing interfaces.
  • The Modern Web: Staying updated with the latest trends and technologies.
  • Algorithms and Data Structures: Building a strong foundation in programming concepts.
  • Databases and Servers: Understanding how to manage data and server-side logic.

:man_teacher: Honestly, it’s been super helpful and even a bit fun to explore. If you're looking to level up your web skills, give it a look!

:rocket: Happy learning! :rocket:

9 Likes