Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update READMEs #281

Merged
merged 14 commits into from
Feb 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 2 additions & 32 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -41,23 +41,6 @@ For eg. `python -m venv .venv`
5. Add `.env` file to the `backend` folder. And add the variables as defined in [.env.template](./.env.template)
6. Create the static files to serve during execution by `python manage.py collectstatic`


### How to setup the VC+

1) Navigate to VC+:```cd VC+```
2) Activate the environment:```source env/bin/activate```
3) Install required packages
```
pip install django
pip install djangorestframework
pip install django-webpack-loader
```

4) Install dependencies for REACT (with Yarn or npm, required Node.JS >= 14.16)
```
cd react_frontend/ && yarn install
```

## Start Application

#### Step 1: Start Frontend
Expand All @@ -69,21 +52,8 @@ cd react_frontend/ && yarn install
1. Navigate to the backend directory:```cd backend```
2. Start the backend server:```python3 manage.py runserver 8080```


#### Step 4: Start VC+ Frontend
1. Navigate to VC+:```cd VC+```
2. Navigate to the react_frontend directory:```cd react_frontend```
3. Run the development server:```yarn run dev```


#### Step 5: Start Another Backend Instance
1. Open another terminal.
2. Navigate to VC+:```cd VC+```
3. Activate the environment:```source env/bin/activate```
4. Start another instance of the backend server:```python3 manage.py runserver```

#### Step 6: Run Docker image RADI
``sudo docker run --rm -it --name radi -p 2303:2303 -p 1905:1905 -p 8765:8765 -p 6080:6080 -p 1108:1108 -p 7163:7163 jderobot/robotics-academy:3.4.5 --no-server``
### How to setup the VC+
In order to setup VC+ to use RoboticsAcademy and VisualCircuit together, follow the instructions given [here](./VC%2B/README.md)


<!-- CONTRIBUTING -->
Expand Down
104 changes: 102 additions & 2 deletions VC+/README.md
Original file line number Diff line number Diff line change
@@ -1,2 +1,102 @@
# VC+
Version 1.0
<div id="top"></div>

<a href="https://jderobot.github.io/"><img src="docs/assets/gif/logo.gif" width="150" align="right" /></a>

# Visual Circuit +


[![Contributors][contributors-shield]][contributors-url]
[![Forks][forks-shield]][forks-url]
[![Stargazers][stars-shield]][stars-url]
[![Issues][issues-shield]][issues-url]
[![License](http://img.shields.io/:license-gpl-blue.svg)](http://opensource.org/licenses/GPL-2.0)




Visual Circuit+ is an **open source** tool to use RoboticsAcademy alongwith Visual Circuit. We start a Docker image of Robotics Academy and connect to it with our Visual Circuit instance. This is done in order to able to use Circuits directly from the web-editor and run them with RoboticsAcademy exercises.

For more information visit our site [VisualCircuit](https://jderobot.github.io/VisualCircuit/)


## Prerequisite

### Front-end
For more specific instructions check the frontend [readme](./frontend/README.md)
1. Clone the repository https://github.com/JdeRobot/VisualCircuit.git
3. Change directory to `frontend`
4. Run `npm install`


### Back-end
For more specific instructions check the backend [readme](./backend/README.md)

1. Clone the repository https://github.com/JdeRobot/VisualCircuit.git
2. Change directory to `backend`
3. Create a Python3 virtual environment using venv.
For eg. `python -m venv .venv`
4. After activating the virtual environment, install the dependencies by running
`pip install -r requirements.txt`
5. Add `.env` file to the `backend` folder. And add the variables as defined in [.env.template](./.env.template)
6. Create the static files to serve during execution by `python manage.py collectstatic`


### How to setup the VC+

1) Navigate to VC+:```cd VC+```
2) Activate the environment:```source env/bin/activate```
3) Install required packages
```
pip install django
pip install djangorestframework
pip install django-webpack-loader
```

4) Install dependencies for REACT (with Yarn or npm, required Node.JS >= 14.16)
```
cd react_frontend/ && yarn install
```

## Start Application

#### Step 1: Start Frontend
1. Navigate to the frontend directory:```cd frontend```
2. Start the frontend server:```npm start```


#### Step 2: Start Backend
1. Navigate to the backend directory:```cd backend```
2. Start the backend server:```python3 manage.py runserver 8080```


#### Step 4: Start VC+ Frontend
1. Navigate to VC+:```cd VC+```
2. Navigate to the react_frontend directory:```cd react_frontend```
3. Run the development server:```yarn run dev```


#### Step 5: Start Another Backend Instance
1. Open another terminal.
2. Navigate to VC+:```cd VC+```
3. Activate the environment:```source env/bin/activate```
4. Start another instance of the backend server:```python3 manage.py runserver```

#### Step 6: Run Docker image RADI
``sudo docker run --rm -it --name radi -p 2303:2303 -p 1905:1905 -p 8765:8765 -p 6080:6080 -p 1108:1108 -p 7163:7163 jderobot/robotics-academy:3.4.5 --no-server``


<!-- MARKDOWN LINKS & IMAGES -->
<!-- https://www.markdownguide.org/basic-syntax/#reference-style-links -->
[contributors-shield]: https://img.shields.io/github/contributors/JdeRobot/VisualCircuit.svg?style=plastic
[contributors-url]: https://github.com/JdeRobot/VisualCircuit/graphs/contributors
[forks-shield]: https://img.shields.io/github/forks/JdeRobot/VisualCircuit.svg?style=plastic
[forks-url]: https://github.com/JdeRobot/VisualCircuit/network/members
[stars-shield]: https://img.shields.io/github/stars/JdeRobot/VisualCircuit.svg?style=plastic
[stars-url]: https://github.com/JdeRobot/VisualCircuit/stargazers
[issues-shield]: https://img.shields.io/github/issues/JdeRobot/VisualCircuit.svg?style=plastic
[issues-url]: https://github.com/JdeRobot/VisualCircuit/issues
[license-shield]: https://img.shields.io/github/license/opensource.org/licenses/GPL-2.0
[license-url]: http://opensource.org/licenses/GPL-2.0
[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=plastic&logo=linkedin&colorB=555
[linkedin-url]: https://linkedin.com/in/linkedin_username
[product-screenshot]: images/screenshot.png
2 changes: 1 addition & 1 deletion backend/.env.template
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@
# The key (for eg. DJANGO_DEBUG) should be as is in this template file. They are used in code to access the value.

DJANGO_DEBUG=true -> Don't set this is prod. Set it only for DEV
VISUAL_CIRCUIT_FRONTEND_HOST='http://localhost:3000' -> Url for the VisualCircuit frontend
VISUAL_CIRCUIT_FRONTEND_HOST='http://localhost:4000' -> Url for the VisualCircuit frontend
DJANGO_ALLOWED_HOSTS=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -> list of hosts to allow. For eg. localhost,visualcircuit.org
DJANGO_SECRET_KEY=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -> Secret key for django backend
2 changes: 1 addition & 1 deletion backend/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,4 +12,4 @@ For eg. `python -m venv .venv`
`pip install -r requirements.txt`
5. Add `.env` file to the `backend` folder. And add the variables as defined in [.env.template](./.env.template)
6. Create the static files to serve during execution by `python manage.py collectstatic`
7. Start the server by running `python manage.py runserver 8000`
7. Start the server by running `python manage.py runserver 8080`
2 changes: 1 addition & 1 deletion frontend/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ React based front end application for VisualCircuit3.
3. Change directory to `frontend`
4. Run `npm install`
5. Run `npm start`
6. Open http://localhost:3000/ in browser.
6. Open http://localhost:4000/ in browser.



Expand Down