Update setup-environment.yml #37
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Setup Environment | ||
| on: | ||
| push: | ||
| branches: | ||
| - main | ||
| jobs: | ||
| setup-environment: | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - name: Checkout repository | ||
| uses: actions/checkout@v4 | ||
| - name: Set up Node.js | ||
| uses: actions/setup-node@v3 | ||
| with: | ||
| node-version: '16' | ||
| - name: Create directories for course | ||
| run: | | ||
| mkdir -p course-materials/lectures | ||
| mkdir -p course-materials/exercises | ||
| mkdir -p course-materials/resources | ||
| mkdir -p practical-lab-work | ||
| mkdir -p web-portal | ||
| mkdir -p web-portal/css | ||
| mkdir -p web-portal/js | ||
| mkdir -p web-portal/assets | ||
| - name: Verify directory structure | ||
| run: | | ||
| ls -la course-materials | ||
| ls -la practical-lab-work | ||
| ls -la web-portal | ||
| - name: Create initial course files | ||
| run: | | ||
| echo "# Lectures" > course-materials/lectures/README.md | ||
| echo "# Exercises" > course-materials/exercises/README.md | ||
| echo "# Resources" > course-materials/resources/README.md | ||
| echo "# Practical Lab Work" > practical-lab-work/README.md | ||
| cat <<EOF > web-portal/index.html | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Mobile App Development for Juniors</title> | ||
| <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;700&display=swap" rel="stylesheet"> | ||
| <link rel="stylesheet" href="css/styles.css"> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-app.js"></script> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-auth.js"></script> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-firestore.js"></script> | ||
| </head> | ||
| <body> | ||
| <header> | ||
| <h1>Mobile App Development for Juniors</h1> | ||
| <h2>Course Code: MADJ101</h2> | ||
| <h3>Building Foundational Skills for Future App Developers</h3> | ||
| </header> | ||
| <nav> | ||
| <ul> | ||
| <li><a href="lectures.html">Lectures</a></li> | ||
| <li><a href="exercises.html">Exercises</a></li> | ||
| <li><a href="resources.html">Resources</a></li> | ||
| <li><a href="practical-lab.html">Practical Lab Work</a></li> | ||
| </ul> | ||
| </nav> | ||
| <main> | ||
| <section id="content"> | ||
| <h2>Welcome to the Course Portal</h2> | ||
| <p>Navigate through the sections to access course materials and lab exercises.</p> | ||
| <div id="auth-container"> | ||
| <div id="login-form"> | ||
| <h3>Login</h3> | ||
| <input type="email" id="login-email" placeholder="Email"> | ||
| <input type="password" id="login-password" placeholder="Password"> | ||
| <button onclick="login()">Login</button> | ||
| </div> | ||
| <div id="register-form"> | ||
| <h3>Register</h3> | ||
| <input type="email" id="register-email" placeholder="Email"> | ||
| <input type="password" id="register-password" placeholder="Password"> | ||
| <button onclick="register()">Register</button> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </main> | ||
| <footer> | ||
| <p>© 2024 Skunkworks (Pty) Ltd. All rights reserved.</p> | ||
| </footer> | ||
| <script src="js/scripts.js"></script> | ||
| </body> | ||
| </html> | ||
| EOF | ||
| cat <<EOF > web-portal/css/styles.css | ||
| /* CSS styles for the course portal */ | ||
| body { | ||
| font-family: "IBM Plex Sans", sans-serif; | ||
| background-color: #f4f4f9; | ||
| color: #333; | ||
| margin: 0; | ||
| padding: 0; | ||
| } | ||
| header { | ||
| background-color: #1a73e8; | ||
| color: white; | ||
| text-align: center; | ||
| padding: 20px 0; | ||
| box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | ||
| } | ||
| header h1 { | ||
| font-size: 2.5em; | ||
| margin: 0.2em 0; | ||
| font-weight: 700; | ||
| } | ||
| header h2 { | ||
| font-size: 1.2em; | ||
| margin: 0.2em 0; | ||
| font-weight: 400; | ||
| } | ||
| header h3 { | ||
| font-size: 1em; | ||
| margin: 0.2em 0; | ||
| font-weight: 400; | ||
| } | ||
| nav ul { | ||
| list-style: none; | ||
| padding: 0; | ||
| display: flex; | ||
| justify-content: center; | ||
| background-color: #1a73e8; | ||
| margin: 0; | ||
| } | ||
| nav ul li { | ||
| margin: 0 15px; | ||
| } | ||
| nav ul li a { | ||
| color: white; | ||
| text-decoration: none; | ||
| font-weight: 700; | ||
| } | ||
| nav ul li a:hover { | ||
| text-decoration: underline; | ||
| } | ||
| main { | ||
| padding: 20px; | ||
| } | ||
| footer { | ||
| text-align: center; | ||
| padding: 10px 0; | ||
| background-color: #1a73e8; | ||
| color: white; | ||
| position: fixed; | ||
| width: 100%; | ||
| bottom: 0; | ||
| } | ||
| EOF | ||
| cat <<EOF > web-portal/js/scripts.js | ||
| // Firebase configuration | ||
| const firebaseConfig = { | ||
| apiKey: "${{ secrets.AISTUDIO_API_KEY }}", | ||
| authDomain: "course-madj101.firebaseapp.com", | ||
| projectId: "course-madj101", | ||
| storageBucket: "course-madj101.appspot.com", | ||
| messagingSenderId: "491294238145", | ||
| appId: "1:491294238145:web:66bcaff49ae8f7faed3b40", | ||
| measurementId: "G-GDQCV0XQVJ" | ||
| }; | ||
| // Initialize Firebase | ||
| firebase.initializeApp(firebaseConfig); | ||
| const auth = firebase.auth(); | ||
| const db = firebase.firestore(); | ||
| // Login function | ||
| function login() { | ||
| const email = document.getElementById("login-email").value; | ||
| const password = document.getElementById("login-password").value; | ||
| auth.signInWithEmailAndPassword(email, password) | ||
| .then((userCredential) => { | ||
| const user = userCredential.user; | ||
| alert("Login successful!"); | ||
| // Redirect to course materials page or update UI accordingly | ||
| }) | ||
| .catch((error) => { | ||
| alert("Login failed: " + error.message); | ||
| }); | ||
| } | ||
| // Register function | ||
| function register() { | ||
| const email = document.getElementById("register-email").value; | ||
| const password = document.getElementById("register-password").value; | ||
| auth.createUserWithEmailAndPassword(email, password) | ||
| .then((userCredential) => { | ||
| const user = userCredential.user; | ||
| alert("Registration successful!"); | ||
| // Save user data to Firestore | ||
| db.collection("users").doc(user.uid).set({ | ||
| email: email, | ||
| progress: { | ||
| lectures: [], | ||
| exercises: [], | ||
| labWork: [] | ||
| } | ||
| }); | ||
| // Redirect to course materials page or update UI accordingly | ||
| }) | ||
| .catch((error) => { | ||
| alert("Registration failed: " + error.message); | ||
| }); | ||
| } | ||
| // Function to update progress | ||
| function updateProgress(section, item) { | ||
| const user = auth.currentUser; | ||
| if (user) { | ||
| const userDocRef = db.collection("users").doc(user.uid); | ||
| userDocRef.update({ | ||
| ["progress." + section]: firebase.firestore.FieldValue.arrayUnion(item) | ||
| }).then(() => { | ||
| alert("Progress updated!"); | ||
| }).catch((error) => { | ||
| alert("Error updating progress: " + error.message); | ||
| }); | ||
| } else { | ||
| alert("No user logged in!"); | ||
| } | ||
| } | ||
| // Function to submit quiz | ||
| function submitQuiz() { | ||
| const user = auth.currentUser; | ||
| if (user) { | ||
| const form = document.getElementById("quiz-form"); | ||
| const answers = { | ||
| question1: form.elements["question1"].value, | ||
| question2: form.elements["question2"].value | ||
| }; | ||
| db.collection("users").doc(user.uid).collection("assessments").add({ | ||
| quiz: answers, | ||
| timestamp: firebase.firestore.FieldValue.serverTimestamp() | ||
| }).then(() => { | ||
| alert("Quiz submitted!"); | ||
| }).catch((error) => { | ||
| alert("Error submitting quiz: " + error.message); | ||
| }); | ||
| } else { | ||
| alert("No user logged in!"); | ||
| } | ||
| } | ||
| EOF | ||
| - name: Create quiz page | ||
| run: | | ||
| cat <<EOF > web-portal/quiz.html | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Quiz</title> | ||
| <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;700&display=swap" rel="stylesheet"> | ||
| <link rel="stylesheet" href="css/styles.css"> | ||
| </head> | ||
| <body> | ||
| <header> | ||
| <h1>Course Quiz</h1> | ||
| </header> | ||
| <main> | ||
| <section id="quiz-content"> | ||
| <form id="quiz-form"> | ||
| <h2>Question 1</h2> | ||
| <p>What is the purpose of an MVP?</p> | ||
| <input type="radio" name="question1" value="A"> A. To develop a full-featured product<br> | ||
| <input type="radio" name="question1" value="B"> B. To gather early feedback<br> | ||
| <input type="radio" name="question1" value="C"> C. To avoid user testing<br> | ||
| <h2>Question 2</h2> | ||
| <p>Which tool is used for version control?</p> | ||
| <input type="radio" name="question2" value="A"> A. Git<br> | ||
| <input type="radio" name="question2" value="B"> B. Docker<br> | ||
| <input type="radio" name="question2" value="C"> Jenkins<br> | ||
| <button type="button" onclick="submitQuiz()">Submit</button> | ||
| </form> | ||
| </section> | ||
| </main> | ||
| <footer> | ||
| <p>© 2024 Skunkworks (Pty) Ltd. All rights reserved.</p> | ||
| </footer> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-app.js"></script> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-auth.js"></script> | ||
| <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-firestore.js"></script> | ||
| <script src="js/scripts.js"></script> | ||
| </body> | ||
| </html> | ||
| EOF | ||
| - name: Create package.json | ||
| run: | | ||
| if [ ! -f package.json ]; then | ||
| cat <<EOF > package.json | ||
| { | ||
| "name": "madj101", | ||
| "version": "1.0.0", | ||
| "description": "Mobile App Development for Juniors", | ||
| "main": "index.js", | ||
| "scripts": { | ||
| "test": "echo \\"Error: no test specified\\" && exit 1", | ||
| "build": "webpack --config webpack.config.js" | ||
| }, | ||
| "author": "Raydo Matthee", | ||
| "license": "ISC", | ||
| "dependencies": { | ||
| "webpack": "^5.0.0", | ||
| "webpack-cli": "^4.0.0" | ||
| } | ||
| } | ||
| EOF | ||
| fi | ||
| - name: Create webpack.config.js | ||
| run: | | ||
| cat <<EOF > webpack.config.js | ||
| const path = require("path"); | ||
| module.exports = { | ||
| entry: "./web-portal/js/scripts.js", | ||
| output: { | ||
| filename: "bundle.js", | ||
| path: path.resolve(__dirname, "web-portal/js") | ||
| }, | ||
| mode: "production" | ||
| }; | ||
| EOF | ||
| - name: Install dependencies | ||
| run: npm install | ||
| - name: Build project | ||
| run: npm run build | ||
| - name: Deploy to Fireba se | ||
| uses: FirebaseExtended/action-hosting-deploy@v0 | ||
| with: | ||
| repoToken: ${{ secrets.GITHUB_TOKEN }} | ||
| firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_COURSE_MADJ101 }} | ||
| channelId: live | ||
| projectId: course-madj101 | ||
| - name: Verify deployment | ||
| run: | | ||
| curl https://course-madj101.web.app | ||
| curl https://course-madj101.web.app/lectures.html | ||
| curl https://course-madj101.web.app/exercises.html | ||
| curl https://course-madj101.web.app/resources.html | ||
| curl https://course-madj101.web.app/practical-lab.html | ||
| curl https://course-madj101.web.app/quiz.html | ||
| curl https://course-madj101.web.app/css/styles.css | ||
| curl https://course-madj101.web.app/js/bundle.js | ||
| curl https://course-madj101.web.app/js/scripts.js | ||
| curl https://course-madj101.web.app/index.html | ||
| curl https://course-madj101.web.app/404.html | ||
| curl https://course-madj101.web.app/favicon.ico | ||
| curl https://course-madj101.web.app/robots.txt | ||
| curl https://course-madj101.web.app/manifest.json | ||
| curl https://course-madj101.web.app/sw.js | ||
| curl https://course-madj101.web.app/firebase-messaging-sw.js | ||
| curl https://course-madj101.web.app/__/firebase/init.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-app.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-auth.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-firestore.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-messaging.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-performance.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-storage.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-analytics.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-remote-config.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-functions.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-database.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-ml.js | ||
| curl https://course-madj101.web.app/__/firebase/9.6.1/firebase-ml-natural-language.js | ||
