-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added legacy documentation for "Ask @lvkaszus! - version: 2.x".
- Loading branch information
Showing
5 changed files
with
927 additions
and
37 deletions.
There are no files selected for viewing
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,297 @@ | ||
| # After installation steps | ||
|
|
||
| When you are done installing Ask @lvkaszus! Project, please follow those steps accordingly to expose this application to world-wide web! | ||
|
|
||
| ⚠️ WARNING! You will need a domain name and a valid SSL/TLS certificate for it! ⚠️ | ||
|
|
||
| ⚠️ Otherwise, your Anonymous Q&A application will mostly not work because connections to the API Endpoints are with `https://` prefix in application source code and also the Cookies created on Admin Panel page that are stored inside client's browser are with `Secure=True` argument that works only with HTTPS websites! | ||
|
|
||
|
|
||
| ## Prerequisites | ||
|
|
||
| You must have installed all the components from Main installation guide available in `Installation.md` file. If you didn't install anything from there, those instructions will be non-sense to you and your server. | ||
|
|
||
|
|
||
| If you didn't opened HTTP and HTTPS ports for incoming traffic to your application server, DO THIS NOW! - If you won't do this, you will have problems with accessing your Anonymous Q&A App instance. | ||
|
|
||
|
|
||
| - Open ports `80` and `443` to enable HTTP and HTTPS on your server. For example if you are using FirewallD as your firewall, just use those commands on your server: | ||
|
|
||
| ``` | ||
| sudo firewall-cmd --zone=public --permanent --add-port=80/tcp | ||
| sudo firewall-cmd --zone=public --permanent --add-port=443/tcp | ||
| sudo firewall-cmd --reload | ||
| ``` | ||
|
|
||
|
|
||
| # Expose your instance to world-wide web! | ||
|
|
||
| Exposing your instance is mandatory step to allow receiving anonymous questions from people or your friends, and also to manage your installed instance! Scroll down to see how to configure NGINX as a Reverse Proxy for Docker or Non-Docker Instance. | ||
|
|
||
| ## Install and configure NGINX as a Reverse Proxy | ||
|
|
||
| ### NGINX - for Docker Instance | ||
|
|
||
| - If you not installed NGINX binary on your server yet, install it by using this command (I am using Ubuntu and APT Package Manager, edit this command to match your Linux distribution Package Manager): | ||
|
|
||
| ⚠️ WARNING! You can also use NGINX in Docker if you want and use it that way. My personal choice is NGINX Non-Docker + Apps in Docker. ⚠️ | ||
|
|
||
| `sudo apt install nginx` | ||
|
|
||
| - Enable NGINX if it isn't running: | ||
|
|
||
| `sudo systemctl enable --now nginx` | ||
|
|
||
| - Import your SSL/TLS Certificate files to directory that you would like to use by using SFTP connection or by pasting `.pem` and `.key` file contents to your favourite text editor and save those as `.pem` and `.key` files to use them inside NGINX Configuration files. | ||
|
|
||
| - Configure NGINX to serve your Backend API Endpoints and also your Main Frontend and Admin Panel by using your preferred text editor: | ||
|
|
||
| `sudo nano /etc/nginx/sites-available/asklvkaszus-stack` | ||
|
|
||
| - Paste this NGINX Example Configuration file contents below to your new `asklvkaszus-stack` configuration file and change some entries to match your needs: | ||
|
|
||
| ``` | ||
| # Ask @lvkaszus! - Docker NGINX Configuration Stack: | ||
| server { | ||
| listen 80; | ||
| listen [::]:80; | ||
| listen 443 ssl http2; | ||
| listen [::]:443 ssl http2; | ||
| server_name YOUR_MAIN_FRONTEND_DOMAIN_NAME; # Must be same that is set in Backend because of CORS! | ||
| ssl_certificate YOUR_CERTIFICATE_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert.pem | ||
| ssl_certificate_key YOUR_CERTIFICATE_KEY_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert_key.key | ||
| ssl_protocols TLSv1.2 TLSv1.3; | ||
| ssl_prefer_server_ciphers on; | ||
| ssl_ciphers "TLS_AES_128_GCM_SHA256:TLS_AES_256_GCM_SHA384:TLS_CHACHA20_POLY1305_SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305"; | ||
| ssl_ecdh_curve secp384r1; | ||
| ssl_session_timeout 10m; | ||
| ssl_session_cache shared:SSL:10m; | ||
| ssl_session_tickets off; | ||
| ssl_stapling on; | ||
| ssl_stapling_verify on; | ||
| add_header Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"; | ||
| add_header X-Frame-Options "SAMEORIGIN"; | ||
| add_header X-Content-Type-Options nosniff; | ||
| add_header X-XSS-Protection "1; mode=block"; | ||
| server_tokens off; | ||
| location /api/ { | ||
| proxy_pass http://127.0.0.1:3030; # If you changed Backend port during container configuration, please update it! | ||
| proxy_set_header X-Forwarded-For $remote_addr; | ||
| proxy_set_header Host $host; | ||
| proxy_http_version 1.1; | ||
| proxy_set_header Connection ""; | ||
| # Needed headers to make Q&A working | ||
| proxy_set_header Question $http_question; | ||
| proxy_set_header Authorization $http_authorization; | ||
| proxy_set_header Answer $http_answer; | ||
| } | ||
| location / { | ||
| proxy_pass http://127.0.0.1:3031; # If you changed Frontend port during container configuration, please update it! | ||
| proxy_set_header X-Forwarded-For $remote_addr; | ||
| proxy_set_header Host $host; | ||
| proxy_http_version 1.1; | ||
| proxy_set_header Connection ""; | ||
| } | ||
| if ($https = '') { return 301 https://$host$request_uri; } | ||
| } | ||
| server { | ||
| listen 80; | ||
| listen [::]:80; | ||
| listen 443 ssl http2; | ||
| listen [::]:443 ssl http2; | ||
| server_name YOUR_ADMIN_FRONTEND_DOMAIN_NAME; # Must be same that is set in Backend because of CORS! | ||
| ssl_certificate YOUR_CERTIFICATE_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert.pem | ||
| ssl_certificate_key YOUR_CERTIFICATE_KEY_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert_key.key | ||
| ssl_protocols TLSv1.2 TLSv1.3; | ||
| ssl_prefer_server_ciphers on; | ||
| ssl_ciphers "TLS_AES_128_GCM_SHA256:TLS_AES_256_GCM_SHA384:TLS_CHACHA20_POLY1305_SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305"; | ||
| ssl_ecdh_curve secp384r1; | ||
| ssl_session_timeout 10m; | ||
| ssl_session_cache shared:SSL:10m; | ||
| ssl_session_tickets off; | ||
| ssl_stapling on; | ||
| ssl_stapling_verify on; | ||
| add_header Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"; | ||
| add_header X-Frame-Options "SAMEORIGIN"; | ||
| add_header X-Content-Type-Options nosniff; | ||
| add_header X-XSS-Protection "1; mode=block"; | ||
| server_tokens off; | ||
| location / { | ||
| proxy_pass http://127.0.0.1:3032; # If you changed Admin Panel port during container configuration, please update it! | ||
| proxy_set_header X-Forwarded-For $remote_addr; | ||
| proxy_set_header Host $host; | ||
| proxy_http_version 1.1; | ||
| proxy_set_header Connection ""; | ||
| } | ||
| if ($https = '') { return 301 https://$host$request_uri; } | ||
| } | ||
| ``` | ||
|
|
||
| - Save the file and exit your text editor. Create symlink from `sites-available` to `sites-enabled` folder to make this configuration file enabled inside NGINX: | ||
|
|
||
| `sudo ln -sf /etc/nginx/sites-available/asklvkaszus-stack /etc/nginx/sites-enabled/asklvkaszus-stack` | ||
|
|
||
| - Check your configuration file for errors: | ||
|
|
||
| `sudo nginx -t` | ||
|
|
||
| - If you see `nginx: the configuration file [...] syntax is ok` message on your screen, you can restart your NGINX server by running this command: | ||
|
|
||
| `sudo service nginx restart` | ||
|
|
||
| - Your App should be now available when you visit your domain name where you wanted to install this project! If everything works correctly, then congratulations - You Made It! | ||
|
|
||
|
|
||
| #### You experienced problems after installation process? | ||
|
|
||
| If you experienced any problems after the installation, open and read `Common problems after installation.md` file for further help! | ||
|
|
||
| ### NGINX - for Non-Docker Instance | ||
|
|
||
| - If you not installed NGINX binary on your server yet, install it by using this command (I am using Ubuntu and APT Package Manager, edit this command to match your Linux distribution Package Manager): | ||
|
|
||
| `sudo apt install nginx` | ||
|
|
||
| - Enable NGINX if it isn't running: | ||
|
|
||
| `sudo systemctl enable --now nginx` | ||
|
|
||
| - Import your SSL/TLS Certificate files to directory that you would like to use by using SFTP connection or by pasting `.pem` and `.key` file contents to your favourite text editor and save those as `.pem` and `.key` files to use them inside NGINX Configuration files. | ||
|
|
||
| - Configure NGINX to serve your Backend API Endpoints and also your Main Frontend and Admin Panel by using your preferred text editor: | ||
|
|
||
| `sudo nano /etc/nginx/sites-available/asklvkaszus-stack` | ||
|
|
||
| - Paste this NGINX Example Configuration file contents below to your new `asklvkaszus-stack` configuration file and change some entries to match your needs: | ||
|
|
||
| ``` | ||
| # Ask @lvkaszus! - Non-Docker NGINX Configuration Stack: | ||
| server { | ||
| listen 80; | ||
| listen [::]:80; | ||
| listen 443 ssl http2; | ||
| listen [::]:443 ssl http2; | ||
| server_name YOUR_MAIN_FRONTEND_DOMAIN_NAME; # Must be same that is inside asklvkaszus-backend.py file because of CORS! | ||
| ssl_certificate YOUR_CERTIFICATE_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert.pem | ||
| ssl_certificate_key YOUR_CERTIFICATE_KEY_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert_key.key | ||
| ssl_protocols TLSv1.2 TLSv1.3; | ||
| ssl_prefer_server_ciphers on; | ||
| ssl_ciphers "TLS_AES_128_GCM_SHA256:TLS_AES_256_GCM_SHA384:TLS_CHACHA20_POLY1305_SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305"; | ||
| ssl_ecdh_curve secp384r1; | ||
| ssl_session_timeout 10m; | ||
| ssl_session_cache shared:SSL:10m; | ||
| ssl_session_tickets off; | ||
| ssl_stapling on; | ||
| ssl_stapling_verify on; | ||
| add_header Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"; | ||
| add_header X-Frame-Options "SAMEORIGIN"; | ||
| add_header X-Content-Type-Options nosniff; | ||
| add_header X-XSS-Protection "1; mode=block"; | ||
| server_tokens off; | ||
| location /api/ { | ||
| proxy_pass http://127.0.0.1:3030; # If you changed Backend port in gunicorn_config.py file, please update it! | ||
| proxy_set_header X-Forwarded-For $remote_addr; | ||
| proxy_set_header Host $host; | ||
| proxy_http_version 1.1; | ||
| proxy_set_header Connection ""; | ||
| # Needed headers to make Q&A working | ||
| proxy_set_header Question $http_question; | ||
| proxy_set_header Authorization $http_authorization; | ||
| proxy_set_header Answer $http_answer; | ||
| } | ||
| location / { | ||
| root /var/www/asklvkaszus-frontend; # If you specified other directory than this while installing Frontend, please update it! | ||
| index index.html | ||
| } | ||
| if ($https = '') { return 301 https://$host$request_uri; } | ||
| } | ||
| server { | ||
| listen 80; | ||
| listen [::]:80; | ||
| listen 443 ssl http2; | ||
| listen [::]:443 ssl http2; | ||
| server_name YOUR_ADMIN_FRONTEND_DOMAIN_NAME; # Must be same that is inside asklvkaszus-backend.py file because of CORS! | ||
| ssl_certificate YOUR_CERTIFICATE_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert.pem | ||
| ssl_certificate_key YOUR_CERTIFICATE_KEY_FILE_PATH; # Example: /etc/ssl/my_domain_tls_cert_key.key | ||
| ssl_protocols TLSv1.2 TLSv1.3; | ||
| ssl_prefer_server_ciphers on; | ||
| ssl_ciphers "TLS_AES_128_GCM_SHA256:TLS_AES_256_GCM_SHA384:TLS_CHACHA20_POLY1305_SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305"; | ||
| ssl_ecdh_curve secp384r1; | ||
| ssl_session_timeout 10m; | ||
| ssl_session_cache shared:SSL:10m; | ||
| ssl_session_tickets off; | ||
| ssl_stapling on; | ||
| ssl_stapling_verify on; | ||
| add_header Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"; | ||
| add_header X-Frame-Options "SAMEORIGIN"; | ||
| add_header X-Content-Type-Options nosniff; | ||
| add_header X-XSS-Protection "1; mode=block"; | ||
| server_tokens off; | ||
| location / { | ||
| root /var/www/asklvkaszus-admin; # If you specified other directory than this while installing Admin Panel, please update it! | ||
| index index.html; | ||
| } | ||
| if ($https = '') { return 301 https://$host$request_uri; } | ||
| } | ||
| ``` | ||
|
|
||
| - Save the file and exit your text editor. Create symlink from `sites-available` to `sites-enabled` folder to make this configuration file enabled inside NGINX: | ||
|
|
||
| `sudo ln -sf /etc/nginx/sites-available/asklvkaszus-stack /etc/nginx/sites-enabled/asklvkaszus-stack` | ||
|
|
||
| - Check your configuration file for errors: | ||
|
|
||
| `sudo nginx -t` | ||
|
|
||
| - If you see `nginx: the configuration file [...] syntax is ok` message on your screen, you must fix permissions for your Frontend and Admin Panel static files: | ||
|
|
||
| ``` | ||
| sudo chown -R www-data:www-data /var/www/asklvkaszus-frontend # If you specified other directory than this while installing Frontend, please update it! | ||
| sudo chown -R www-data:www-data /var/www/asklvkaszus-admin # If you specified other directory than this while installing Admin Panel, please update it! | ||
| ``` | ||
| - Finally, restart your NGINX server by running this command: | ||
|
|
||
| `sudo service nginx restart` | ||
|
|
||
| - Your App should be now available when you visit your domain name where you wanted to install this project! If everything works correctly, then congratulations - You Made It! | ||
|
|
||
|
|
||
| #### You experienced problems after installation process? | ||
|
|
||
| If you experienced any problems after the installation, open and read `Common problems after installation.md` file for further help! |
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| # Common problems after installation | ||
|
|
||
| If you experienced any problems after installation and configuration of my project. Check out those possible fixes for you below before opening a new issue on GitHub! | ||
|
|
||
| <u>This list will be updated regularly when I will get a new issue about this app, and it will be easy to fix.</u> | ||
|
|
||
| ### Can't connect to MySQL server on 'xxx:3306' | ||
|
|
||
| This error will be displayed inside logs of GUnicorn server or in the output of the terminal itself, and it is coming from Ask @lvkaszus! Backend side - where questions and answers are handled on the application server. | ||
|
|
||
| Example of this error will look like this: | ||
| - `mysql.connector.errors.DatabaseError: 2003 (HY000): Can't connect to MySQL server on 'localhost:3306' (61)` | ||
|
|
||
|
|
||
| That means that Backend side written in Python can't connect to your questions and answers database, where it will put all of your Q&A data. | ||
|
|
||
| <u><b>How can I fix this?<b></u> | ||
|
|
||
| You can fix this, by double-checking the database hostname or IP address that you provided when installing this application. Check if it is correct and not have maybe typo somewhere. If you are used Non-Docker installation method, try replacing your current MySQL Host inside Backend source code file and inside `# BEGIN CONFIGURATION` and `# END CONFIGURATION` there will be a `host='',` line. Try entering there `localhost` or when localhost is not working, try your local IP like `192.168.1.50`. | ||
|
|
||
| But if you was using Docker installation method to install this application, you not missed anything and fixes that I provided above are not working, check if all of the containers are on the same network or create new Docker network and deploy all of the needed containers again but with newly created network attached to all of them. If this doesn't work, you can try typing inside `MYSQL_HOST` environment variable in `asklvkaszus-backend` container a correct name of the MariaDB (or other database server) container like `asklvkaszusdatabase`. | ||
|
|
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| # BBCode Integration | ||
|
|
||
| "Ask @lvkaszus!" Project has built-in BBCode support that can format text inside questions and answers. This is done temporarily (for now) by using regular expressions and placing HTML Code inside elements using `dangerouslySetInnerHTML` in React and sanitizing input in Python backend. All done by myself - I was trying to find a suitable library for this, but `react-bbcode` or other libraries like this we're not working in my project 😢 | ||
|
|
||
| This is not a good idea for long-term usage, but in the next release - I will replace this with `BBob` React library thanks to my friend from school named <a href="https://github.com/Bazyli12">@Bazyli12</a> for providing me a nice template for using this library inside React projects! ❤️ | ||
|
|
||
| ## What is BBCode? | ||
|
|
||
| BBCode is an easy way to format text such as <u>underlining</u>, <b>bolding</b> or <i>italicizing</i> and allows in this project to insert YouTube videos and map locations in the form of geographic coordinates. Also there is automatic URL detection system in questions sent by people using your application based on this project! | ||
|
|
||
| For example: | ||
| - Paste any URL to question form or reply form and when the question or answer has been sent, it automatically transforms this URL it into clickable link in user interface. | ||
|
|
||
| ## What BBCodes are supported? | ||
|
|
||
| There are several BBCodes supported in this app: | ||
|
|
||
| - `[b]Bold Text[/b]` - Makes the text in the question that is in the [b] and [/b] tags bold like this: <b>Bold text!</b> | ||
|
|
||
| - `[u]Underlined Text[/u]` - Makes the text in the question that is in the [u] and [/u] tags underlined like this: <u>Underlined Text!</u> | ||
|
|
||
| - `[i]Italicized text[/i]` - Makes the text in the question that is in the [u] and [/u] tags italicized like this: <i>Italicized Text!</i> | ||
|
|
||
| Special BBCodes: | ||
|
|
||
| - `[yt]Link to YouTube video[/yt]` - Inserts a YouTube video in the question that is in the [yt] and [/yt] tags. You can check it yourself by self-hosting this project on your own and having fun with it! | ||
|
|
||
| - `[location:Latitude,Longtitude]` - Inserts a location on map by specifying latitude and longtitude in the [location] tag. You can also check it by yourself when self-hosting this project on your own and having fun with it! | ||
|
|
||
| ## How to use them inside questions and answers? | ||
|
|
||
| It's pretty easy to use them inside your questions and/or answers! Just type your question or answer like you would do it normally, but type additional things in question/reply form like this: | ||
|
|
||
| - `This is a question with [b]bold text inside![/b]` | ||
|
|
||
| It will look like this after submitting: This is a question with <b>bold text inside!</b> | ||
|
|
||
| ## And how to use Special BBCodes like YouTube video embed or map location? | ||
|
|
||
| You also write your question or answer like you would normally do, but with `[yt]Link to YouTube Video[/yt]` tags inside! | ||
|
|
||
| - `Check out this new video! [yt]https://youtube.com/watch?v=ABCD1234[/yt]` | ||
|
|
||
| This will send your question or answer like a normal message but with YouTube Player that plays your video under submitted question/answer! | ||
|
|
||
|
|
||
| Using Map Location is also straight-forward! Just get your selected location latitude and longtitude numbers from the Internet and write your question/answer just like this: | ||
|
|
||
| - `Check out this place! [location:52.237049,21.017532]` | ||
|
|
||
| This will send your question or answer like a normal message but with location on OpenStreetMaps that shows city of Warsaw in Poland! |
Oops, something went wrong.