HackYourFuture-CPH · adamblanchard · Apr 29, 2025 · Apr 28, 2025 · Apr 28, 2025 · Apr 28, 2025
@@ -5,11 +5,12 @@
 
 ## Modules
 
-| Name                                                                       | Weeks |
-| -------------------------------------------------------------------------- | ----- |
-| [Collaboration via GitHub](../../shared-modules/collaboration-via-github/) | 1     |
-| Backend JavaScript stuff                                                   | ?     |
-| [Databases](./databases/)                                                  | 2     |
-| More JS stuff                                                              | ?     |
-| [Final project](./final-project/)                                          | 3     |
-| [Career training](../../legacy/career-training/)                           | 3     |
+| Name                                                                         | Weeks |
+| ---------------------------------------------------------------------------- | ----- |
+| [Collaboration via GitHub](../../shared-modules/collaboration-via-github/)   | 1     |
+| Backend JavaScript stuff                                                     | ?     |
+| [Databases](./databases/)                                                    | 2     |
+| More JS stuff                                                                | ?     |
+| [Team processes (advanced)](../../shared-modules/team-processes-advanced/)   | 1     |
+| [Final project](./final-project/)                                            | 3     |
+| [Career training (advanced)](../../shared-modules/career-training-advanced/) | 3     |
@@ -1,3 +1,8 @@
 # Databases
 
 TODO
+
+Lesson1 is already been covered in foundation. These is the remaining content:
+
+Week 1: [legacy lesson2](../../../legacy/databases/lesson2/)
+Week 2: [legacy lesson3](../../../legacy/databases/lesson3/)
@@ -7,12 +7,13 @@
 
 | Name                                                       | Weeks |
 | ---------------------------------------------------------- | ----- |
-| [HTML & CSS](./HTML-CSS)                                   | 1     |
-| [Git](../../legacy/git/git1/)                              | 1     |
+| [HTML & CSS](./html-css)                                   | 1     |
+| [Git](./git)                                               | 1     |
 | [Javascript Foundation](./javascript-foundation/README.md) | 6     |
 | [Databases](./databases/)                                  | 1     |
 | [Introduction to backend / APIs](./intro-to-backend/)      | 1     |
-| [Team processes](./team-processes/)                        | 1     |
+| [Team processes](./team-processes-intro)                   | 1     |
 | [Final project](./final-project/)                          | 2–3   |
+| [Career Training](./career-training/)                      | 2–3   |
 
 Total: 13—14 weeks.
@@ -0,0 +1,7 @@
+# Career Training
+
+We need to cover career skills in foundation for two reasons: these skills take a long time to practice and develop, so they should start now. Secondly, in theory some people could leave now with the goal to get an entry level role in tech, and we should prepare them as best we can.
+
+We already have an existing module that we will teach the same at the end of a specialism, but let’s use it for inspiration here too:
+
+**Week 1:** Some light version of [legacy week1](../../../legacy/career-training/week-1/) and [legacy week 2](../../../legacy/career-training/week-2/) combined and tweak to be more relevant for foundation grads. Technical interviews (../../../legacy/career-training/week-3/) are mostly only relevant for software engineers, so leave that out of here (let’s use them in the application process to a specialism course instead, for practice).
@@ -0,0 +1,15 @@
+# HTML-CSS
+
+This repository contains the course material for the one and only HTML/CSS session. During the session we will review the concepts learned from the [Pre-course](../../Pre-course/README.md) materials and work hands-on with a large [exercise](./The-one-and-only-week1/README.md).
+
+| Week | Topic                                                                                                       | Preparation                              | Lesson Plan                                       | Homework                  |
+| ---- | ----------------------------------------------------------------------------------------------------------- | ---------------------------------------- | ------------------------------------------------- | ------------------------- |
+| 1.   | Advanced HTML & CSS concepts, hands-on exercise turning Figma Wireframe into code, teamwork & peer-learning | [Pre-course](../../Pre-course/README.md) | [Lesson Plan](./The-one-and-only-week1/README.md) | [Homework](./homework.md) |
+
+## Learning goals
+
+- Round-up the [Pre-course](../../Pre-course/README.md) materials
+- Talk about any possible questions regarding the concepts learned so far
+- Briefly introduce Figma
+- Spend a lot of time with hands-on coding, figuring out the [exercise](./The-one-and-only-week1/README.md)
+- Learn to work efficiently with your teammates
@@ -0,0 +1,10 @@
+# Order form exercise
+
+Use the `Session-exercise-template` to get started!
+
+Design:
+<https://www.figma.com/file/VwksDkp1vSPhpfa62LWIAz/HTML%2FCSS-session1?type=design&node-id=0-1&mode=design&t=seawrJIXVyPoIt9L-0>
+
+![Desktop design](Session-exercise-template/images/order-desktop.png)
+
+![Mobile design](Session-exercise-template/images/order-mobile.png)
@@ -0,0 +1,4 @@
+/* var(--gradient) */
+/* :root {
+  --gradient: your gradient color here;
+} */
@@ -0,0 +1,62 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" type="text/css" href="order.css" />
+    <title>PAYMENT <span>FORM</span></title>
+  </head>
+
+  <body>
+    <header>
+      <div id="order-summary"></div>
+    </header>
+
+    <form>
+      <div>
+        <h2 id="">Payment Method</h2>
+      </div>
+
+      <div id="">
+        <h2 id="">Card Info</h2>
+        <div id="">
+          <div>
+            <label for="card-number">Card number</label><br />
+            <input
+              type="text"
+              id=""
+              placeholder="1234 1234 1234 1234"
+              name="card-number"
+              required
+            />
+          </div>
+
+          <div>
+            <label for="exp-date">Expiry date</label><br />
+            <input
+              type="text"
+              id=""
+              placeholder="MM / YY"
+              name="exp-date"
+              required
+            />
+          </div>
+
+          <div>
+            <label for="sec-code">Security code</label><br />
+            <input
+              type="text"
+              id=""
+              placeholder="CVV"
+              name="sec-code"
+              required
+            />
+          </div>
+        </div>
+      </div>
+
+      <input type="submit" id="buy-now" value="Buy now" />
+      <p id="">Need Help?</p>
+    </form>
+  </body>
+</html>
@@ -0,0 +1,48 @@
+# How to submit the first homework?
+
+While you have not gone through [Git](https://github.com/HackYourFuture-CPH/Git) yet, you will submit your first homework in a different way. This applies only to the first homework. If you are confident with basic Git already, feel free to do the submission in a proper version-control way.
+
+`1.` go to your homework repository`*` on github and to the branches section:
+
+![screenshot](images/image.png)
+
+`2.` find the "New branch" button and create a new branch, that follows the naming convention:
+
+`html-css/yourname`
+
+- ❌ html/css/maria
+- ❌ hmtl-css/maria
+- ❌ html-css-homework
+- ❌ html/maria
+- ❌ htmlcss/maria
+- ✅ html-css/maria
+
+`3.` Go to the branch. It appears in the branch overview right after creation:
+
+![screenshot](images/image-1.png)
+
+Or, if you are not there for some reason, go back to the repository overview and find your new branch in the drop-down:
+
+![screenshot](images/image-2.png)
+
+To verify that you have switched to the branch, it should appear selected:
+
+![screenshot](images/image-3.png)
+
+`4.` Go to the html-css folder and upload your homework:
+
+![screenshot](images/image-4.png)
+
+`5.` Write a commit message and press "Commit changes":
+
+![screenshot](images/image-5.png)
+
+`6.` Go to "Pull requests" in the repository bar, and create a new pull request to the main branch <- from your branch:
+
+![screenshot](images/image-6.png)
+
+`7.` That is it! You should see your pull request listed in the "Pull requests" tab.
+
+`8.` Post a link to your homework Pull Request in your class channel.
+
+`*` It is either your own homework repository in your own GitHub account or the central class homework repository in the HackYourFuture-CPH GitHub account - depending on what approach is being followed for your class. Follow the information and instructions regarding this, and ask if you are still unsure.
@@ -0,0 +1,33 @@
+# HOMEWORK
+
+Make your own `Developer CV / Portfolio page`!
+
+There is a long way to go in the learning journey, but why not start with a good online presence from the get-go?
+
+Make it as extravagant as you like and look around the internet for inspiration (f.x. [here](https://scrimba.com/articles/web-developer-portfolio-inspiration)), while the **minimum requirements** are:
+
+- [ ] Two files: .html and .css
+- [ ] Navigation bar leading to different parts of the single-page website
+- [ ] Header element with your name and title
+- [ ] Contact section that also includes the most important SoMe links
+- [ ] Short description section
+- [ ] Skill showcase section highlighting your technical skills
+- [ ] Portfolio section having the [FCC Survey Form](https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-survey-form-project/build-a-survey-form) as the first project.`*`
+- [ ] Advanced CSS and/or animations applied to implement interesting interactive elements
+- [ ] Website responsiveness so it looks good on different screen sizes and devices
+- [ ] Deploy your page on [Netlify](https://www.netlify.com)!
+
+`*` it is not advisable to have tutorial or course projects in your portfolio, you should make sure to have unique and interesting self-driven projects. However, it is a bit too early for that. Start with the "Survey Form" and keep building and extending your project portfolio as you learn!
+
+❗ Remember: you have to submit the homework during the week, before the weekend, so plan your workload accordingly. You can keep working on this portfolio in the future, so just focus on doing a nice initial version for now!
+
+Check [the first homework submission](https://github.com/HackYourFuture-CPH/HTML-CSS/blob/main/first-homework-submission.md) instructions to make sure to submit the homework correctly!
+
+**Small tip:**
+
+- Got to [Loom.com](https://www.loom.com/) and download the app or plugin.
+- It's a great way to quickly share explainer videos or explain issues you are facing.
+
+Good luck! ✌️
+
+![Jim Carrey as the eponymous "Bruce Almighty", busily typing away](https://media.giphy.com/media/13GIgrGdslD9oQ/giphy.gif)
@@ -0,0 +1,7 @@
+# Team Processes Intro
+
+TODO
+
+This module is currently under development for use in the current live teams. Once we have it, it should be placed here. For now, we keep a 1 week placeholder.
+
+It will introduce principles and processes around working in a dev team, scrum, backlog, tasks, rituals (e.g. standup), value of transparency and collaboration.
@@ -5,11 +5,11 @@
 
 ## Modules
 
-| Name                                                                       | Weeks |
-| -------------------------------------------------------------------------- | ----- |
-| [Collaboration via GitHub](../../shared-modules/collaboration-via-github/) | 1     |
-| Frontend JavaScript stuff                                                  | ?     |
-| [React](./react/)                                                          | 5     |
-| [Team processes (front-end)](./team-processes/)                            | 1     |
-| [Final project](./final-project/)                                          | 3     |
-| [Career training](../../legacy/career-training/)                           | 3     |
+| Name                                                                         | Weeks |
+| ---------------------------------------------------------------------------- | ----- |
+| [Collaboration via GitHub](../../shared-modules/collaboration-via-github/)   | 1     |
+| Frontend JavaScript stuff                                                    | ?     |
+| [React](./react/)                                                            | 5     |
+| [Team processes (advanced)](../../shared-modules/team-processes-advanced/)   | 1     |
+| [Final project](./final-project/)                                            | 3     |
+| [Career training (advanced)](../../shared-modules/career-training-advanced/) | 3     |
@@ -0,0 +1,9 @@
+# Career Training (Advanced)
+
+We introduced career training in foundation, but here we should reiterate, go deeper, and more specialist focussed.
+
+There is reasonable chance that we will have some specialist specific learning goals in here. It's in shared until we know if/what the split looks like.
+
+Week 1: [legacy week1](../../legacy/career-training/week-1/)
+Week 2: [legacy week2](../../legacy/career-training/week-2/)
+Week 3: [legacy week3](../../legacy/career-training/week-3/)
@@ -0,0 +1,6 @@
+# Team processes (advanced)
+
+> See foundation description for more context. It should be a more advanced,
+> software development focussed version here. It could diverge between specialisms, but start in one module and split out if needed.
+
+TODO