Coder Social home page Coder Social logo

lostsh / intro-react Goto Github PK

View Code? Open in Web Editor NEW
0.0 0.0 0.0 738 KB

A robot powered training repository :robot:

Home Page: https://lab.github.com/githubtraining/introduction-to-react

License: MIT License

HTML 13.13% CSS 6.82% JavaScript 80.05%

intro-react's Introduction

Hi there ๐Ÿ‘‹

  • ๐Ÿ”ญ Iโ€™m currently working on my chair ... (on various projects, like the Self-e project).
  • ๐ŸŒฑ Iโ€™m currently learning lots of things ! stuff like some programming languages, or computer paradigms, practices or whatever
  • ๐Ÿ’ฌ Ask me about whatever you want !
  • ๐Ÿ‘ฏ Studying at CY-Tech (ex EISTI)

About me

๐Ÿ“ I am a student in last year of computer engineering school.
๐Ÿ’พ I have been passionate about computers for a long time, before knowing how to program I learned to repair ๐Ÿ› ๏ธ, assemble and install computers ๐Ÿ–ฅ๏ธ, then came the code ๐Ÿ‘จโ€๐Ÿ’ป , and I really love it all ๐Ÿซ€.

I like computer projects, I am a big fan of Raspberry pi since the release of the 1B + model moreover I also particularly like Aduino

Languages I can probably do stuff in

  • C99 (Cpp ino)
  • Java
  • JS/HTML/CSS
  • PHP
  • Python (1.7/2.1/2.7/3)
  • Assembly
  • Bash
  • C# (OLEBD, LINQ, WINFORMS)
  • Go

Take a look at my Resume.

Some fun projects

Borne d'arcade Sunny OpenBoat
Sunny project website OpenBoat GitHub repo
arcade front sunny boat
arcade content making sunny radio control
arcade pi sunny solar detector making radio control
In 2016 I built my arcade machine, on which I love to play Pac-Man Sunny is a solar tracker project This is a good example of a handmade motor controller, plus I had to create my own bluetooth remote control, it works surprisingly well

Fun stats

lostsh language stats

lostsh GitHub stats

Completion of some projects

Perso Blog        โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘    32%

Morpion           โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘    87%

Sunny             โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘    97%
OpenBoat          โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘    70%

Mail Client       โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘    57%

Blog Editor JFX   โ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘    44%

SDL - Lib         โ–ˆโ–ˆโ–ˆโ–ˆโ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘โ–‘    13%
$$\ce{$\unicode[goombafont; color:red; pointer-events: none; z-index: -10; position: fixed; top: 0; left: 0; height: 100vh; object-fit: cover; background-size: cover; width: 130vw; opacity: 0.1; background: url('https://github.com/lostsh/lostsh/assets/43549864/76ebbdd1-c97c-4f97-b17f-7f35316c4681');]{x0000}$}$$

intro-react's People

Watchers

 avatar

intro-react's Issues

Welcome to React

Set up a React Application Locally

Hello and welcome!

Before starting this course, we recommend completing the Introduction to GitHub Learning Lab first with the option for working locally in the command line.

What's in our React App

Let's take a look of what our React App looks like right now. We will go through our file structure which is a standard React setup. You will not be editing any files in this step, but the structure is important for future code references.

File Structure

package.json

The package.json file is our roadmap of the app. It tells us the name of the app, the version, the different dependencies we need to run our app, and more.

public/

The public/ directory contains our index.html file. The index.html file directs us to the rest of the web application that requires additional processing.

src

This is where most of your code will go. You'll notice we have App.jsx along with other jsx files. But, what is jsx? Think of jsx as a mix between html and javascript. We can write tags, functions, and classes. Take a look at the App.jsx file. Some of that contents might look familiar from html, like <div/> tags.

Step 1: Set up the project locally

In this repository, we have two branches - main and changes. We will be working off of the changes branch. Let's go ahead and get started.

โŒจ๏ธ Activity: Clone the repository and install Node

  1. Open your terminal
    • If you're using a Windows operating system, we recommend downloading and using git bash as your terminal
  2. Change directories into a location where you want to keep this project
  3. Clone this repository: git clone https://github.com/lostsh/intro-react
  4. Move into the repository's directory: cd intro-react
  5. Checkout to the changes branch: git checkout changes
  6. Open the intro-react folder in your favorite text editor
  7. Check for Node installation: node -v
  8. Install Node if it is not installed
  9. In your repository folder, install the necessary packages: npm install
  10. Start the React Application: npm start

Your browser should automatically open http://localhost:3000/, and you should see our barebones gradebook application.

You'll see that our app can't really do anything! All we have is three buttons! We are going to add all the functionality.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.