Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    zadavan
    @zadavan
    just the UI, it needs work
    eshnil
    @eshnil
    I started work on adding WebFinger and ActivityPub support as per learn-awesome/learn#121 . This will allow anyone in fediverse to follow our users' reviews in any app like Mastodon or Pleroma. Inbox implementation (needed for keeping track of followers) is pending.
    eshnil
    @eshnil

    I added react-rails and built a simple component just as proof-of-concept that React works within Rails app. These components live in app/javascript/components. More info here: https://github.com/reactjs/react-rails

    It looks like server-side rendering is also possible which means we should be able to use React on all pages, not just ones that logged-in users can see.

    Need to do this thoughtfully though:
    (1) Semantic markup goes beyond the SEO benefits.
    (2) Now we have 3 ways of building view components :-D
    • Rails partials in app/views/components
    • ActionView::Component in app/components
    • and now React components in app/javascript/components
    The proof-of-concept React components are in app/views/welcome/whatsnew.html.erb and will be shown on /whatsnew page.
    Jigyasu Arya
    @lastnamearya

    I added react-rails and built a simple component just as proof-of-concept that React works within Rails app. These components live in app/javascript/components. More info here: https://github.com/reactjs/react-rails

    It looks like server-side rendering is also possible which means we should be able to use React on all pages, not just ones that logged-in users can see.

    👍

    eshnil
    @eshnil
    @lastnamearya @zadavan Why don't the two of you identify some areas where we can start using React to improve the UX for logged-in users?
    Jigyasu Arya
    @lastnamearya

    @lastnamearya @zadavan Why don't the two of you identify some areas where we can start using React to improve the UX for logged-in users?

    Hi @zadavan :wave:

    zadavan
    @zadavan
    Hello @lastnamearya
    @eshnil nice to see you are implementing ActivityPub!
    also I wonder maybe Vue will be better suited for this project, since our priority might be rapid experimentation and iteration given the user's feedback
    zadavan
    @zadavan
    vue excels at flexibility and new contributors might start adding code easier
    WDYT?
    Jigyasu Arya
    @lastnamearya

    Hello @lastnamearya

    Can we get on a Zoom call so we can start :)

    eshnil
    @eshnil
    One approach could be to build a fresh app using the GraphQL api
    Hasura offers a quick way to generate graphql API for any database in Postgres. No backend code would be necessary.
    I have the graphql instance running in Heroku.
    zadavan
    @zadavan
    using graphql may add an extra layer of complexity
    eshnil
    @eshnil
    Getting the graphql backend ready and stable will also make it easy to build mobile apps, desktop apps, browser extensions etc
    zadavan
    @zadavan
    but this could improve separation of concerns
    people could work at frontend without worrying about the backend
    and backend work without compromising the frontend
    i like the idea
    You need an API secret to access this graphql console. Can share publicly once the APis are secured. You can read up on Hasura in the meanwhile.
    zadavan
    @zadavan
    @eshnil are there going to be two repositories?
    one for frontend and one for backend?
    or all in one?
    eshnil
    @eshnil
    Separate
    This would be the graphql query to get 5 items, with their links for a topic by name:
    query getLinksForTopic ($topic_name: String!) {
      topics(where: { name: { _eq: $topic_name } }  ) {
        id
        name
        topic_idea_sets(limit:5) {
          idea_set {
            items {
              name
              item_type_id
              links {
                url
              }
            }
          }
        }
      }
    }
    You can build out the pages for logged-out users, while I implement the security rules for logging in, adding items, adding reviews etc.
    eshnil
    @eshnil
    You should create a new public repo here to start: https://github.com/learn-awesome
    Don't forget to add an open-source license. I think AGPL would be the most appropriate.
    learn-anything.xyz has some designs on Figma: https://www.figma.com/file/N2ioUbr7aiapNijNH8DH3Xh3/Learn?node-id=108%3A2
    You could take this as a starting point to implement the React UI. Or take ideas from learnawesome.org.
    Jigyasu Arya
    @lastnamearya

    You should create a new public repo here to start: https://github.com/learn-awesome
    Don't forget to add an open-source license. I think AGPL would be the most appropriate.

    :pencil:

    eshnil
    @eshnil
    For the react app, consider using NextJS from the start: https://mxstbr.com/thoughts/tech-choice-regrets-at-spectrum
    eshnil
    @eshnil
    JWT token issuing for GraphQL client now works. Also, added the read permissions for user role. So graphQL clients can use all the select queries they need.
    image.png
    All these queries are now accessible to GraphQL clients.
    See the bottom of README for instructions on how to implement auth in graphql clients: https://github.com/learn-awesome/learn/blob/master/README.md
    eshnil
    @eshnil
    anonymous access also works now.
    eshnil
    @eshnil
    New Frontend to be built with GraphQL + NextJS + React : https://github.com/learn-awesome/learn-awesome-frontend
    The idea is to build it on the lines of LearnAnything.xyz's roadmap and ideas: https://github.com/learn-anything/docs/tree/master/docs Also decouple the backend and frontend work with GraphQL so that contributing becomes easier for more developers.
    Backend devs can then focus on importing more resources and connections to build the learning map.
    eshnil
    @eshnil
    Added sample GraphQL query and Heroku configuration and deployed at https://nextreactgql.herokuapp.com/
    The topics on this page are being fetched from LearnAwesome's existing db via Hasura :sunglasses: :metal:
    eshnil
    @eshnil
    To explore and test the graphql queries, use Hasura console: https://lagql.herokuapp.com/console
    DM me for the admin secret.
    I'd recommend building a full-fledged experience for anonymous users before taking up auth etc.
    eshnil
    @eshnil
    The entire graphql schema maps directly to the database schema which is available here: https://github.com/learn-awesome/learn/blob/master/db/structure.sql
    eshnil
    @eshnil
    example gql:
    query getLinksForTopic ($topic_name: String!) {
      topics(where: { name: { _eq: $topic_name } }  ) {
        id
        name
        topic_idea_sets {
          idea_set {
            items {
              name
              item_type_id
              links {
                url
              }
            }
          }
        }
      }
    }
    eshnil
    @eshnil
    On the React+GraphQL app, do you need any help? @zadavan @lastnamearya