title: Creating a Gradle build file for React App
body: <p>I am trying to set up a starter React project. I have used a <code>create-react-app</code> to create a starter app. I linked it to our Firebase account, and made a simple page to display stored dummy data.</p>
  <p>We initialized the firebase within our project using <code>firebase init</code> then installed the following dependencies: firebase cloud functions, firebase firestore.</p>
  <p>Here is our App.js</p>
  <pre><code>import './App.css';
  import React from 'react';
  import { initializeApp } from 'firebase/app';
  import { getFirestore } from &quot;firebase/firestore&quot;;
  import { collection, query, where, getDocs, initializeFirestore } from &quot;firebase/firestore&quot;;
  import { useState } from &quot;react&quot;;
  
  // Your web app's Firebase configuration
  const firebaseConfig = {
    apiKey: &quot;hidden&quot;,
    authDomain: &quot;hidden&quot;,
    projectId: &quot;hidden&quot;,
    storageBucket: &quot;hidden&quot;,
    messagingSenderId: &quot;hidden&quot;,
    appId: &quot;hidden&quot;
  };
  
  // Initialize Firebase
  const firebaseapp = initializeApp(firebaseConfig);
  
  const db = getFirestore(firebaseapp);
  
  function App() {
    
    const [firebaseData, updateData] = useState([]);
    //getPreferences(updateData);
    return (
      &lt;div className=&quot;App&quot;&gt;
        &lt;header className=&quot;App-header&quot;&gt;
          &lt;div&gt;{firebaseData.map(item =&gt; &lt;div&gt; {item} &lt;/div&gt;)}&lt;/div&gt;
  
          &lt;button onClick={() =&gt; getPreferences(updateData)}&gt;Fetch Data&lt;/button&gt;
          
        &lt;/header&gt;
      &lt;/div&gt;
    );
  }
  
  async function getPreferences(updateData) {
    const q = query(collection(db, &quot;preferences&quot;));
  
    const querySnapshot = await getDocs(q);
    let data = [];
    querySnapshot.forEach((doc) =&gt; {
      data.push(JSON.stringify(doc.data()));
    });
    updateData(data);
  }
  
  export default App;
  </code></pre>
  <p>We are running the following commands to run the app locally: <code>npm install</code>, <code>npm install firebase</code>, and <code>npm start</code>.</p>
  <p>We are trying to create a single Grade build file to package everything which would run all of these commands and allow to launch the app.</p>
  <p>We used the following command to initialize Gradle: <code>gradle init --type basic --dsl groovy --project-name</code></p>
  <p>Here is what I have for Gradle build file:</p>
  <pre><code>plugins {
      id &quot;com.moowork.node&quot; version &quot;1.2.0&quot;
      id 'com.google.gms.google-services'
  }
  
  apply plugin: 'base'
  apply plugin: &quot;com.moowork.node&quot;
  apply plugin: 'com.google.gms.google-services'
   
  node {
      version = &quot;16.2.0&quot;
      download = true
  }
  
  dependencies {
      classpath 'com.google.gms:google-services:4.3.10'
      implementation platform('com.google.firebase:firebase-bom:29.3.1')
      implementation 'com.google.firebase:firebase-auth'
      implementation 'com.google.firebase:firebase-firestore'
      implementation 'com.google.firebase:firebase-functions'
  }
   
  task bundle(type: NpmTask, dependsOn: npmInstall) {
      args = ['run', 'build']
  }
   
  assemble.dependsOn(bundle)
  </code></pre>
  <p>And I'm getting the following error when trying to run <code>gradle</code>:</p>
  <ul>
  <li><p>Where:
  Build file '/Users/rkudryashov/Desktop/PartnerUp/build.gradle' line: 10</p>
  </li>
  <li><p>What went wrong:
  Plugin [id: 'com.google.gms.google-services'] was not found in any of the following
  sources:</p>
  </li>
  </ul>
  <ul>
  <li>Gradle Core Plugins (plugin is not in 'org.gradle' namespace)</li>
  <li>Plugin Repositories (plugin dependency must include a version number for this
  source)</li>
  </ul>
  <p>I am trying to make it so all of the dependencies are installed locally when running <code>gradle</code> even if a person doesn't have those installed.</p>
  <p>Where did we go wrong?</p>