diff options
Added a tutorial on MySql and C# and Entity Framework. Items in projects and tutorials will be separated by a blank line. Updated formating on some files.
9 files changed, 258 insertions, 35 deletions
| -rw-r--r-- | website/projects/index.html | 9 | ||||
| -rw-r--r-- | website/projects/mundus/basic-concepts.html | 8 | ||||
| -rw-r--r-- | website/projects/mundus/user-interface.html | 45 | ||||
| -rw-r--r-- | website/styles-multiple-page-articles.css | 24 | ||||
| -rw-r--r-- | website/tutorials/connect-to-mysql-in-csharp-ef/connecting.html | 94 | ||||
| -rw-r--r-- | website/tutorials/connect-to-mysql-in-csharp-ef/images/connections.png | bin | 0 -> 10067 bytes | |||
| -rw-r--r-- | website/tutorials/connect-to-mysql-in-csharp-ef/introduction.html | 53 | ||||
| -rw-r--r-- | website/tutorials/connect-to-mysql-in-csharp-ef/preparation.html | 55 | ||||
| -rw-r--r-- | website/tutorials/index.html | 5 |
diff --git a/website/projects/index.html b/website/projects/index.html index 508bcd3..df83906 100644 --- a/website/projects/index.html +++ b/website/projects/index.html @@ -5,6 +5,7 @@ <link rel="shortcut icon" href="../images/favicon.png" type="image/png"/> <title>Syndamia - Projects</title> <link rel="stylesheet" href="../styles.css"> + <link rel="stylesheet" href="../styles-multiple-page-articles.css"> </head> <body> @@ -18,6 +19,14 @@ <div class=page-centered> <a href="./mundus/introduction.html" class=hyperlink>Mundus</a> + + <hr class=separator> + + syndamiadotcom [COMING SOON] + + <hr class=separator> + + Bitspace [COMING SOON] </div> <br> diff --git a/website/projects/mundus/basic-concepts.html b/website/projects/mundus/basic-concepts.html index a2a98b8..d25ba32 100644 --- a/website/projects/mundus/basic-concepts.html +++ b/website/projects/mundus/basic-concepts.html @@ -57,7 +57,7 @@ </li> </ul> </p> - + <br> <h2>Layers and superlayers</h2> <p> The ingame world (map) is composed of superlayers. Superlayers represent each elevation level in the world. There are in total 5 superlayers (not all are implimented): Space Sky Land Underground ???. @@ -70,7 +70,7 @@ <li>Structures cannot be placed on top of holes (empty spots in the ground layer), except if they are "climable", in which case they will be placed on the structure layer on the superlayer below. Mobs also cannot be on top of holes (they fall to the superlayer below)</li> </ol> </p> - + <br> <h2>Inventory</h2> <p> Each mob can store certain amount of item tiles. That is done in it's inventory. The inventory is comprised of 4 parts: hotbar, items, accessories and gear. @@ -80,12 +80,12 @@ <li>Accessories and gear are used only to store gear tiles.</li> </ul> </p> - + <br> <h2>Crafting</h2> <p> Creating different item tiles is done through crafting. Each craftable item requires from one to five different materials in different quantities. The item tiles must be inside the "items" part of your inventory. </p> - + <br> <h2>Event logs</h2> <p> Certain actions you do in the game are stored in memory as messages (logs). They are also used to give you information that you couldn't get otherwise. For example, there is a log if you can't climb up a superlayer because a mob is blocking the way, or when you damage/kill a structure or mob. diff --git a/website/projects/mundus/user-interface.html b/website/projects/mundus/user-interface.html index 9c30e7f..8f4e139 100644 --- a/website/projects/mundus/user-interface.html +++ b/website/projects/mundus/user-interface.html @@ -6,22 +6,6 @@ <title>Mundus - User interface</title> <link rel="stylesheet" href="../../styles.css"> <link rel="stylesheet" href="../../styles-multiple-page-articles.css"> - - <style media="screen"> - span { - align-self: center; - vertical-align: middle; - } - - .tutorial-img { - padding-right: 15px; - vertical-align: middle; - } - - p { - display: flex; - } - </style> </head> <body> @@ -30,7 +14,7 @@ <a href="./introduction.html" class=other-tab>Introduction</a> <a href="./history.html" class=other-tab>History</a> - <a href="./user-interface.html" class=selected-tab>User Interface</a> + <a href="./user-interface.html" class=selected-tab>User Interface</a> <a href="./basic-concepts.html" class=other-tab>Basic concepts</a> <!-- <a href="./data-layer.html" class=other-tab>Data Layer</a> @@ -43,17 +27,16 @@ <div class=page> Note: all screenshots are made in Linux with Mint-Y theme. - <p> - - <img src="./images/main-screen.png" alt=""> - <span> + <p class=tutorial-p> + <img src="./images/main-screen.png" alt="" class=tutorial-img> + <span class=tutorial-text> We start off at the main screen. <br> Here you can load a save file (not implimented as of 21.05.2020), create a new game, view the tutorial (not implimented as of 21.05.2020), or change settings (not implimented as of 21.05.2020). </span> </p> - <p> + <p class=tutorial-p> <img src="./images/create-new-game.png" alt="" class=tutorial-img> - <span> + <span class=tutorial-text> Creating a game gives you a couple of options. <br><br> First one is Game Mode. Here you can select survival, in which you will start with almost no items and creative (not implimented as of 21.05.2020) where you will have access to all items at all times. <br><br> Then you have difficulty. In higher difficulties, your energy gets depleated much more quickly and trees, boulders and mobs are rarer.<br><br> @@ -62,9 +45,9 @@ </span> </p> Note: all game window screenshots are made with the Small Game Window. - <p> + <p class=tutorial-p> <img src="./images/small-game-window.png" alt="" class=tutorial-img> - <span> + <span class=tutorial-text> After the world is generated, the game window opens.<br><br> A the top you have your (game) screen. Here you can see the world. To navigate click on a place you want to go to. If you want to alter the envirnment, first click on an item (that can modify the world) and click the place you want to alter.<br><br> Below that is your energy bar. Each mob (including the player) has an energy bar, each action you take takes energy. If your energy gets depleated, you start taking damage for each action you take. To replenish energy, kill mobs and consume their meats.<br><br> @@ -78,9 +61,9 @@ Pause - opens the pause window <br> </span> </p> - <p> + <p class=tutorial-p> <img src="./images/map-menu.png" alt="" class=tutorial-img> - <span> + <span class=tutorial-text> The Map menu is an extension (to the left) to the normal game window. It is toggled with the inventory menu (either one of them or neither can be opened at the same time). For more information on the map, refer to <a href="./basic-concepts.html" class=hyperlink>Basic Concepts</a>.<br><br> It contains a couple of things: <br><br> Ground layer - shows only the ground layer tiles of the map <br> @@ -89,9 +72,9 @@ There is hole above player - used to determine if you can climb up a superlayer </span> </p> - <p> + <p class=tutorial-p> <img src="./images/inventory-menu.png" alt="" class=tutorial-img> - <span> + <span class=tutorial-text> The Inventory menu is an extension (to the right) to the normal game window. It is toggled with the map menu (either one of them or neither can be opened at the same time). For more information on the inventory, refer to <a href="./basic-concepts.html" class=hyperlink>Basic Concepts</a>. <br><br> It contains a couple of things: <br><br> Items inventory <br> @@ -101,9 +84,9 @@ Information about the selected item (icon and values) </span> </p> - <p> + <p class=tutorial-p> <img src="./images/crafting-window.png" alt="" class=tutorial-img> - <span> + <span class=tutorial-text> Every time you open the crafting menu, it automatically gets all items that you can craft, using the items in your Items inventory. <br><br> At the top it shows you all required items (icons) and how much you need of each one. <br><br> Below that it shows the item that you can craft. There are also two buttons, Prev and Next, for navigating multiple items you can craft. <br><br> diff --git a/website/styles-multiple-page-articles.css b/website/styles-multiple-page-articles.css index 0fedac2..dc80e2f 100644 --- a/website/styles-multiple-page-articles.css +++ b/website/styles-multiple-page-articles.css @@ -16,3 +16,27 @@ .close :hover { background-color: #ed383b; } + +.tutorial-img { + padding-right: 15px; + vertical-align: middle; +} + +.tutorial-text { + align-self: center; + vertical-align: middle; +} + +.tutorial-p { + display: flex; +} + +.separator { + border: 1px solid #ddd; +} + +.code { + color: #abb2bf; + background-color: #282c34; + padding: 3px; +} diff --git a/website/tutorials/connect-to-mysql-in-csharp-ef/connecting.html b/website/tutorials/connect-to-mysql-in-csharp-ef/connecting.html new file mode 100644 index 0000000..dfbba29 --- /dev/null +++ b/website/tutorials/connect-to-mysql-in-csharp-ef/connecting.html @@ -0,0 +1,94 @@ +<!DOCTYPE html> +<html> + <head> + <link rel='icon' href='../../images/favicon/favicon.png' type='image/png'/> + <link rel="shortcut icon" href="../../images/favicon.png" type="image/png"/> + <title>Connect to MySql in C# and Entitiy Framework - Connecting</title> + <link rel="stylesheet" href="../../styles.css"> + <link rel="stylesheet" href="../../styles-multiple-page-articles.css"> + </head> + + <body> + <div class=header> + <div class=article-title>Connect to MySql in C# and Entitiy Framework</div> + + <a href="./introduction.html" class=other-tab>Introduction</a> + <a href="./preparation.html" class=other-tab>Preparation</a> + <a href="./connecting.html" class=selected-tab>Connecting</a> + + <a href="../index.html" class=close style="margin-left: 403px;"><img src="../../images/ui/close.png" alt="Back"></a> + </div> + + <div class=page> + <h2>Connection string</h2> + <p> + You can find many ways to impliment your connection string from <a href="https://www.connectionstrings.com/mysql/" class=hyperlink>here</a>. + From experience, this one works the best: <br> + <p class=code> + "server=localhost; port=YOUR-PORT; user id=YOUR-USER-ID; password=YOUR-PASSWORD; database=NAME-OF-DATABASE; SslMode=none" + </p> + If you don't know your port or user id, just look at the connection you use to connect to the database. + </p> + <p class=tutorial-p> + <img src="./images/connections.png" alt="MyServer root 127.0.0.1:3306" class=tutorial-img> + <span class=tutorial-text> + In this example, the user id is <i>root</i> and the port is <i>3306</i>. + </span> + </p> + <br> + <h2>ASP.NET Startup</h2> + <p> + If you are making an ASP.NET application, you will need to alter your Startup.cs file. + </p> + <p> + Your ConfigureServices method should currenly look something like this: + <p class=code> +  // This method gets called by the runtime. Use this method to add services to the container. <br> +  public void ConfigureServices(IServiceCollection services) <br> +  { <br> +   services.AddControllersWithViews(); <br> +   services.AddTransient<UserServices, UserServices>(); <br> +   services.AddDbContext<AppDbContext>(opt => <br> +   { <br> +    opt.UseSQL(CONNECTION_STRING); <br> +   }); <br> +  } + </p> + You need to change <span class=code>.UseSQL</span> to <span class=code>.UseMySQL</span> (refer to <a href="./preparations" class=hyperlink>preparations</a> if you haven't already). + </p> + <br> + <h2>DBContext child class</h2> + <p> + If you want to connect a DBContext child class to a MySQL databse, the best way is to override the <span class=code>OnConfiguring</span> method. In the override, in <span class=code>optionsBuilder</span>, call the <span class=code>.UseMySQL</span> method (refer to <a href="./preparations" class=hyperlink>preparations</a> if you haven't already). + </p> + <p> + Example: + <p class=code> +  protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder) <br> +  { <br> +   optionsBuilder.UseMySQL(DataBaseContexts.ConnectionStringMySQL); <br> +  } <br> + </p> + </p> + </div> + + <br> + + <footer class=footer> + <a href="https://github.com/Syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/github.png" alt="GitHub"></a> + <a href="https://stackoverflow.com/users/12036073/syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/stackoverflow.png" alt="StackOverflow"></a> + + <hr width=350px noshade> + + <a href="../index.html" class=hyperlink-footer>Tutorials</a> | + <a href="../../projects/index.html" class=hyperlink-footer>Projects</a> | + <a href="../../about.html" class=hyperlink-footer>About</a> | + <a href="../../resume.html" class=hyperlink-footer>Resume</a> + + <hr width=350px noshade> + + <a href="https://github.com/Syndamia/syndamiadotcom/blob/master/LICENSE" target="_blank" class=hyperlink-footer>Website License</a> | + <a href="../../credit.html" target="_blank" class=hyperlink-footer>Credit</a> + </footer> + </body> +</html> diff --git a/website/tutorials/connect-to-mysql-in-csharp-ef/images/connections.png b/website/tutorials/connect-to-mysql-in-csharp-ef/images/connections.png Binary files differnew file mode 100644 index 0000000..aa7b408 --- /dev/null +++ b/website/tutorials/connect-to-mysql-in-csharp-ef/images/connections.png diff --git a/website/tutorials/connect-to-mysql-in-csharp-ef/introduction.html b/website/tutorials/connect-to-mysql-in-csharp-ef/introduction.html new file mode 100644 index 0000000..d4812fc --- /dev/null +++ b/website/tutorials/connect-to-mysql-in-csharp-ef/introduction.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> + <head> + <link rel='icon' href='../../images/favicon/favicon.png' type='image/png'/> + <link rel="shortcut icon" href="../../images/favicon.png" type="image/png"/> + <title>Connect to MySql in C# and Entitiy Framework - Introduction</title> + <link rel="stylesheet" href="../../styles.css"> + <link rel="stylesheet" href="../../styles-multiple-page-articles.css"> + </head> + + <body> + <div class=header> + <div class=article-title>Connect to MySql in C# and Entitiy Framework</div> + + <a href="./introduction.html" class=selected-tab>Introduction</a> + <a href="./preparation.html" class=other-tab>Preparation</a> + <a href="./connecting.html" class=other-tab>Connecting</a> + + <a href="../index.html" class=close style="margin-left: 403px;"><img src="../../images/ui/close.png" alt="Back"></a> + </div> + + <div class=page> + <p> + Connecting to MySql through C# can be quite tricky. I and many others have wasted too much time trying to figure this out. For that reason, I am making this tutorial. + </p> + <p> + First are preparations in which I will talk about what you need to have for this to work. + </p> + <p> + Second is the actual connecting. This covers changes in code and the all mighty connection string. + </p> + </div> + + <br> + + <footer class=footer> + <a href="https://github.com/Syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/github.png" alt="GitHub"></a> + <a href="https://stackoverflow.com/users/12036073/syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/stackoverflow.png" alt="StackOverflow"></a> + + <hr width=350px noshade> + + <a href="../index.html" class=hyperlink-footer>Tutorials</a> | + <a href="../../projects/index.html" class=hyperlink-footer>Projects</a> | + <a href="../../about.html" class=hyperlink-footer>About</a> | + <a href="../../resume.html" class=hyperlink-footer>Resume</a> + + <hr width=350px noshade> + + <a href="https://github.com/Syndamia/syndamiadotcom/blob/master/LICENSE" target="_blank" class=hyperlink-footer>Website License</a> | + <a href="../../credit.html" target="_blank" class=hyperlink-footer>Credit</a> + </footer> + </body> +</html> diff --git a/website/tutorials/connect-to-mysql-in-csharp-ef/preparation.html b/website/tutorials/connect-to-mysql-in-csharp-ef/preparation.html new file mode 100644 index 0000000..3e1196f --- /dev/null +++ b/website/tutorials/connect-to-mysql-in-csharp-ef/preparation.html @@ -0,0 +1,55 @@ +<!DOCTYPE html> +<html> + <head> + <link rel='icon' href='../../images/favicon/favicon.png' type='image/png'/> + <link rel="shortcut icon" href="../../images/favicon.png" type="image/png"/> + <title>Connect to MySql in C# and Entitiy Framework - Preparation</title> + <link rel="stylesheet" href="../../styles.css"> + <link rel="stylesheet" href="../../styles-multiple-page-articles.css"> + </head> + + <body> + <div class=header> + <div class=article-title>Connect to MySql in C# and Entitiy Framework</div> + + <a href="./introduction.html" class=other-tab>Introduction</a> + <a href="./preparation.html" class=selected-tab>Preparation</a> + <a href="./connecting.html" class=other-tab>Connecting</a> + + <a href="../index.html" class=close style="margin-left: 403px;"><img src="../../images/ui/close.png" alt="Back"></a> + </div> + + <div class=page> + <h2>MySql</h2> + <p> + First of all, you need to insall MySql. You can do that from <a href="https://dev.mysql.com/downloads/installer/" class=hyperlink>here</a>. This is the installer. Skip this step, if you have already done it. + </p> + <h2>NuGet packages</h2> + <p> + For an Entity Framework, <a href="https://www.nuget.org/packages/Microsoft.EntityFrameworkCore" class=hyperlink target="_blank">Microsoft.EntitiyFrameworkCore</a> is the goto packet in this tutorial. + </p> + <p> + Although Microsoft.EntitiyFrameworkCore does offer connectivity with SQL server, <b>it doesn't offer anything for MySql</b>. Thats why we need another package: <a href="https://www.nuget.org/packages/MySql.Data.EntityFrameworkCore/" class=hyperlink>MySql.Data.EntitiyFrameworkCore</a>. + </p> + </div> + + <br> + + <footer class=footer> + <a href="https://github.com/Syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/github.png" alt="GitHub"></a> + <a href="https://stackoverflow.com/users/12036073/syndamia" target="_blank" class=hyperlink-footer><img src="../../images/logos/stackoverflow.png" alt="StackOverflow"></a> + + <hr width=350px noshade> + + <a href="../index.html" class=hyperlink-footer>Tutorials</a> | + <a href="../../projects/index.html" class=hyperlink-footer>Projects</a> | + <a href="../../about.html" class=hyperlink-footer>About</a> | + <a href="../../resume.html" class=hyperlink-footer>Resume</a> + + <hr width=350px noshade> + + <a href="https://github.com/Syndamia/syndamiadotcom/blob/master/LICENSE" target="_blank" class=hyperlink-footer>Website License</a> | + <a href="../../credit.html" target="_blank" class=hyperlink-footer>Credit</a> + </footer> + </body> +</html> diff --git a/website/tutorials/index.html b/website/tutorials/index.html index a02f3fd..447e908 100644 --- a/website/tutorials/index.html +++ b/website/tutorials/index.html @@ -5,6 +5,7 @@ <link rel="shortcut icon" href="../images/favicon.png" type="image/png"/> <title>Syndamia - Tutorials</title> <link rel="stylesheet" href="../styles.css"> + <link rel="stylesheet" href="../styles-multiple-page-articles.css"> </head> <body> @@ -19,6 +20,10 @@ <div class=page-centered> GtkSharp 2.0 [COMING SOON] + <hr class=separator> + + <a href="./connect-to-mysql-in-csharp-ef/introduction.html" class=hyperlink>Connect to MySql in C# and Entity Framework</a> + <p> I have some tutorial-style notes in my <a href="https://github.com/Syndamia/References" class=hyperlink>references repo</a>. Warning: some stuff might be wrong. </p> |
