React / GraphQL Course - Build a social media app (MERNG Stack)

freeCodeCamp.org · 494K views · 2020 · 5:44:28

Open on YouTube

Web developmentDatabases & storagecoursedated

Why Stack Overflow recommends it

Stack Overflow users cite it as the tutorial they were following when they hit errors, and they reference it so others can see the code context, especially for the getPosts undefined and MongoDB connection problems.

Recommended by 2 people across 2 different months, 2020 to 2022.

What it is

A 5h44m freeCodeCamp course by Classsed that builds a full social media app on the MERNG stack (MongoDB, Express, React, Node, GraphQL). It covers the Apollo GraphQL server, auth, posts, likes and comments, the React client, and deployment to Heroku and Netlify.

What people said

Recommends Ann Chou · 2021-02 · Stack Overflow · on “React GraphQL & ApolloServer: Unhandled Rejection (Error): GraphQL error: Cannot access 'post' before initialization”

If you are referring to this video to build the social media app ( [this video] ). You might get this error because of the Button component in the LikeButton.js file. <Button as='div' labelPosition='right' onClick={likePost}> <CustomPopup content={liked? 'unlike post': 'like post'}> {likeButton} </CustomPopup> </Button> This Button component will execute the onClick method you specified (not the '/login' path specified in the {likeButton} ) which is doing the mutation of the database and which will need a authorization header to do it. Therefore, when you are not login (no authorization header) but click on the like button, you will get an error. And here is how I modified: return( user? ( <Butto

Recommends Glen Lim · 2022-05 · Stack Overflow · on “Cannot connect to MongoDB Atlas despite allowing all IP address to access”

I am unable to access MongoDB database for some reason. I have run through the usual suspects such as removing <> brackets around the password and also making my cluster accessible from any IP address. I am trying to connect to one of the sample databases provided by mongoDB 'sample_mflix', I am not sure if this is an issue. In the tutorial I was referring to [this video] the creator leaves the database as 'test' and it works, but i tried this and failed also. Any help would be much appreciated. const { ApolloServer } = require('apollo-server'); const gql = require('graphql-tag'); const mongoose = require ('mongoose'); const { MONGODB } = require('./config.js'); const typeDefs = gql` type Query{

Cites Gayatri Dipali · 2020-11 · Stack Overflow · on “TypeError: Cannot read property 'getPosts' of undefined - useQuery hook, react Functional Components”

I did try searching for the same question but all of those were of either angular or unrelated, I am trying to make a Social app using MongoDB, Express, React, Node, Graphql with Apollo , I am following a video from freecodecamp : Link to the video [this video] In that video everything worked fine but in his deployed version he is having the same error as mine react_devtools_backend.js:2450 TypeError: Cannot read property 'getPosts' of undefined at ae (Home.js:14) at Jo (react-dom.production.min.js:3274) link to the deployed app [LINK] My Code: I am dropping a link to my github repo containing the whole project : Link to github repo [LINK] Stack Overflow was throwing too many indentation issues s

Cites Gayatri Dipali · 2020-11 · Stack Overflow · on “PubSub does not work in Client page but works in Graphql playground - TypeError: data.getPosts is not iterable”

I am trying to make a Social app using MongoDB, Express, React, Node, Graphql with Apollo , I am following a video from freecodecamp : Link to the video [this video] I am using pubsub to achieve a realtime functionality , like when ever a new post has been added it should show up in the home page. I might have missed the code of some file that's why I am dropping a link to my github repo containing the whole project : Link to the github repo [LINK] Home.js : import React, { useContext } from 'react'; import { useQuery } from '@apollo/react-hooks'; import { Grid, Transition } from 'semantic-ui-react'; import { AuthContext } from '../context/auth'; import PostCard from '../components/PostCard'; imp

Cites feddy · 2020-12 · Stack Overflow · on “I get a TypeError: Cannot read property 'getPosts' of undefined when registering a new user”

I am trying to pickup the MERNG stack and started following a tutorial. My problem is the exact one from the link below: TypeError: Cannot read property 'getPosts' of undefined functional components [LINK] Much progress was made towards solving the problem in the threads of the link above but the solution fell short since the person is still having the same TypeError after implementing the solutions. ***I just wanted to add that I went into my Register.js file and imported useContext from react and it seemed to fix my problem. When I took away the import the TypeError came back when clicking the Register button. Not sure if there's a reason for this. Not sure if useContext is directly relate

Cites srish · 2021-11 · Stack Overflow · on “TypeError: Cannot read properties of undefined(reading 'getPosts')”

I am a beginner, and i'm currently following this tutorial [this video] by freecodecamp. And I got two errors, one for the homepage: TypeError: Cannot read properties of undefined (reading 'getPosts') and the other one at login and register page: Unhandled Rejection (TypeError): Cannot read properties of undefined(reading 'extensions') Here are the screenshots of the errors, Home page [LINK] Login/Register page [LINK] So I cloned the github repo and tried to run it, and I got the same error. Here is the link to the github repo: [LINK]