owner/Ancient-Programming-Site
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added C guide index and setup

Browse Source
This commit is contained in:
Rasmus Rasmussen 2025-03-09 15:22:17 +01:00
parent 7f8dcdd239
commit 633e5a4c64
10 changed files with 253 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/App.vue
View File

@ -4,10 +4,9 @@
<header class="flex justify-center">
<nav class="pt-10 text-2xl flex place-items-center">
<RouterLink class="mx-1" to="/">Home</RouterLink>
<RouterLink class="mx-1" to="/About">About</RouterLink>
<RouterLink class="mx-1" to="/C">C</RouterLink>
<RouterLink class="mx-1" to="/Fortran">Fortran</RouterLink>
<RouterLink class="mx-1" to="/Pascal">Pascal</RouterLink>
<RouterLink class="mx-1" to="/Lisp">Lisp</RouterLink>
<RouterLink class="mx-1" to="/About">About</RouterLink>
</nav>
</header>

9
src/components/C/C_Hello_World.vue Normal file
View File

@ -0,0 +1,9 @@
<script setup lang="ts">
import PageStart from "../tags/PageStart.vue";
</script>
<template>
<page-start>Hello World In Fortran 90</page-start>
</template>

28
src/components/C/C_Index.vue Normal file
View File

@ -0,0 +1,28 @@
<script setup lang="ts">
import Paragraph from "../tags/Paragraph.vue";
import PageStart from "../tags/PageStart.vue";
</script>
<template>
<page-start>C</page-start>
<paragraph>C is one of those ancient languages that's still getting used to this very day. It's a language from
the year 1972, making it 53 years young as of 2025. It originated at Bell Labs, and was developed with the purpose of
creating utilities for Unix.<br><br>
In the 80s, C steadily became more and more accepted as the go-to language. Especially with kernel and driver code.
The Linux kernel is one such huge project written in almost purely C, although in recent times, the kernel is introducing
Rust code.
</paragraph>
<p>Table of contents:</p>
<ul>
<li><RouterLink to="/C/SetUp">&gt; Set Up</RouterLink></li>
<li><RouterLink to="/C/SetUp">&gt; Hello World</RouterLink></li>
</ul>
</template>
<style scoped>
</style>

168
src/components/C/C_Set_Up.vue Normal file
View File

@ -0,0 +1,168 @@
<script setup lang="ts">
import PageStart from "../tags/PageStart.vue";
import Paragraph from "../tags/Paragraph.vue";
import CodeTag from "../tags/CodeTag.vue";
</script>
<template>
<page-start>Setting Up The Environment</page-start>
<paragraph>
If you're familiar Fortran, then this guide will be quite easy for you. For C, there isn't really an "official"
compiler, but there are compilers that implement the standards of C. For this guide, we'll be using GCC. There are
other great compilers, such as clang.<br><br>
Just like with the <RouterLink to="/Fortran/SetUp">Fortran set up guide</RouterLink>, we'll be doing this on Fedora
Linux, but other distros, like Ubuntu, would work just as well.
</paragraph>
<p>For Fedora:</p>
<code-tag>$ sudo dnf install gcc</code-tag>
<p>For ubuntu:</p>
<code-tag>$ sudo apt install build-essential</code-tag>
<paragraph>Easy peasy.</paragraph>
<h2 class="text-2xl">Project Structure</h2>
<hr class="mb-6">
<paragraph>For any big C projects, a project structure is very important. It helps to organize and keep track of our
classes and libraries. But for smaller projects, or just for testing purposes, a project structure could be too
redundant.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
project/
├── src/ # Source files (*.c, main.c)
│ └── main.c # Main program file
├── include/ # Header files (*.h)
├── lib/ # Library object files and archives
├── bin/ # Executable binaries
├── build/ # Temporary files (*.o)
├── tests/ # Test files
└── Makefile # Build script
</code></pre>
</div>
<h2 class="text-2xl">Compiling</h2>
<hr class="mb-6">
<paragraph>
Makefiles are very useful, and becomes increasingly useful, the bigger the project gets. A makefile simplifies the
compilation process, as all of the compile flags can be gathered inside a single file. It makes it possible to
dynamically change the compilation depending on the system architecture or config. It also removes the need to
manually compile and link your objects together, every time you make a change.<br><br>
And with a bigger project, comes a big count of source files. That's where a makefile helps a lot, as it handles
and tracks all changes to each file, ensuring that it's only the changed files that gets re-compiled.<br><br>
So let's see a makefile in action. Below code is a simple Hello World application, that we will use a makefile to
compile. Although it's worth noting, that a program this small, a makefile is wildly redundant. But it does show
how it's set up in a simple environment.<br><br>
With this little example, we're doing a Hello World program, but fret not, we'll go into details in a later guide.
</paragraph>
<code-tag>hello.c</code-tag>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
#include &lt;stdio.h&gt;
int main(){
printf("Hello, World!");
return 0;
}
</code></pre>
</div>
<code-tag>makefile</code-tag>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
FC = gfortran # Fortran compiler
FFLAGS = -O2 # Compiler flags (optimization level)
hello: hello.o
$(FC) $(FFLAGS) -o $@ $^
hello.o: hello.f90
$(FC) $(FFLAGS) -c $<
run:
./hello
clean:
rm -f *.o hello
</code></pre>
</div>
<paragraph>
For anyone not programming in a language that uses the <code-tag>make</code-tag> makefile, this might look rather off-putting.
But worry not, because at the end of the day, it's simply just some rules, that the compiler follows to compile your program.
</paragraph>
<ul class="mb-6">
<li>&gt; <code-tag>hello: hello.o</code-tag></li>
<li class="pb-2">&gt; &gt; Here, the program "hello" depends on the object file "hello.o".</li>
<li>&gt; <code-tag>$(CC) $(CFLAGS) -o $@ $^</code-tag></li>
<li class="pb-2">&gt; &gt; This one compiles the object files into the program.</li>
<li>&gt; <code-tag>hello.o: hello.c</code-tag></li>
<li class="pb-2">&gt; &gt; Here, the object file "hello.o" depends on the source file "hello.c".</li>
<li>&gt; <code-tag>$(CC) $(CFLAGS) -c $<</code-tag></li>
<li class="pb-2">&gt; &gt; This one compiles the source files into the object files.</li>
<li>&gt; <code-tag>run: ./hello</code-tag></li>
<li class="pb-2">&gt; &gt; This runs the program if you execute <code-tag>make run</code-tag></li>
<li>&gt; <code-tag>clean: rm -f *.o hello</code-tag></li>
<li class="pb-2">&gt; &gt; Here, the object files gets removed when running <code-tag>make clean</code-tag></li>
</ul>
<paragraph>
A quick note. It's very important that whenever something is indented in a makefile, that it's indented with a tab,
and not 4 spaces. It needs to be a tab character.<br><br>
Now simply run the makefile with the following command.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
$ make
gcc -O2 -c hello.c
gcc -O2 -o hello hello.o
</code></pre>
</div>
<paragraph>
We have now successfully compiled the program with the help of a makefile. Now simply run the program and we'll
see the output.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
$ ./hello
Hello, World!
</code></pre>
</div>
<paragraph>If we run <code-tag>make run</code-tag> command instead, the output should look pretty much the same.</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
$ make run
./hello
Hello, World!
</code></pre>
</div>
</template>
<style scoped>
</style>

16
src/components/Fortran/Fortran_Calls_Methods_Functions_Subroutines.vue
View File

@ -1,3 +1,9 @@
<script setup lang="ts">
import PageStart from "../tags/PageStart.vue";
import Paragraph from "../tags/Paragraph.vue";
import CodeTag from "../tags/CodeTag.vue";
</script>
<template>
<page-start>Calls, Methods, Functions and Subroutines</page-start>
@ -160,12 +166,4 @@ $ ./main
<paragraph class="font-bold">TLDR: Functions are assigned as variables, and subroutines are imported and called with the <code-tag>call</code-tag> keyword.</paragraph>
</template>
<script setup lang="ts">
import PageStart from "../tags/PageStart.vue";
import Paragraph from "../tags/Paragraph.vue";
import CodeTag from "../tags/CodeTag.vue";
</script>
</template>

6
src/components/Fortran/Fortran_Reading_Files.vue
View File

@ -9,10 +9,12 @@ import Paragraph from "../tags/Paragraph.vue";
<template>
<page-start>Reading A File In Fortran 90</page-start>
<paragraph>Reading files in high level programming languages is rather easy. I C#, you would just create a
<paragraph>Reading files in high level programming languages is rather easy. In C#, you would just create a
<code-tag>StreamReader</code-tag> object, and execute: <code-tag>streamReader.ReadLine()</code-tag> and bam,
you've read the first line of the file. Now just check if the string returned is null, in a while loop, and you've
read the whole file. Easy peasy.<br><br>
In Fortran 90, however, there is a little more than that. Not a lot more, to be honest, but there is a little more.</paragraph>
In Fortran 90, however, there is a little more than that. Not a lot more, to be honest, but there is a little more.
Especially if you're using Fortran 90, compared to newer versions. In Fortran 90, you have to read the file, line
by line.</paragraph>
</template>

40
src/components/Fortran/Fortran_Set_Up.vue
View File

@ -14,7 +14,8 @@ import Paragraph from "../tags/Paragraph.vue";
The top listed compiler on Fortran's website, is the GNU Fortran compiler (gfortran). It's the one I will be using
throughout the examples on the site. Unless stated otherwise. There are also some other notable compilers, that
has some rather interesting qualities to them.</paragraph>
has some rather interesting qualities to them.
</paragraph>
<p>Compilers:</p>
<ul class="mb-6">
@ -25,12 +26,13 @@ import Paragraph from "../tags/Paragraph.vue";
</ul>
<paragraph>But we will be using gfortran. Through the examples on this site, I will mainly be focusing on developing on Linux. <br>
First, we install the compiler.</paragraph>
First, we install the compiler.
</paragraph>
<p>For Fedora.</p>
<p>For Fedora:</p>
<code-tag>$ sudo dnf install gcc-gfortran</code-tag>
<p>For ubuntu.</p>
<p>For ubuntu:</p>
<code-tag>$ sudo apt install gfortran</code-tag>
<paragraph>And that's it. Pretty easy.</paragraph>
@ -50,7 +52,8 @@ import Paragraph from "../tags/Paragraph.vue";
But if we're doing micro-projects, as in like, a hello world application, a test application, or a small tool,
this layout is rather redundant, and in the examples on this site, we will only use it on bigger projects,
and we will let you know, when or how we set up the project.</paragraph>
and we will let you know, when or how we set up the project.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
@ -58,10 +61,10 @@ project/
├── src/ # Source files (.f90, .f95, etc.)
│ ├── modules/ # Module definitions
│ └── main.f90 # Main program file
├── include/ # Include files (e.g., interface definitions)
├── include/ # Include files (interface definitions)
├── lib/ # Library object files and archives
├── bin/ # Executable binaries
├── tests/ # Test cases
├── tests/ # Test files
└── Makefile # Build script
</code></pre>
</div>
@ -87,7 +90,8 @@ project/
So let's see a makefile in action. Below code is a simple Hello World application, that we will use a makefile to
compile. Although it's worth noting, that a program this small, a makefile is wildly redundant. But it does show
how it's set up in a simple environment.</paragraph>
how it's set up in a simple environment.
</paragraph>
<code-tag>hello.f90</code-tag>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
@ -119,8 +123,10 @@ clean:
</code></pre>
</div>
<paragraph>The makefile, in the eyes of a modern programmer (C#, Python, JS, Etc) might look rather repulsive. But be not
afraid, because at the end of the day, it's simply just some rules, that the compiler follows to compile your program.</paragraph>
<paragraph>
The makefile, in the eyes of a modern programmer (C#, Python, JS, Etc) might look rather repulsive. But be not
afraid, because at the end of the day, it's simply just some rules, that the compiler follows to compile your program.
</paragraph>
<ul class="mb-6">
<li>&gt; <code-tag>hello: hello.o</code-tag></li>
@ -142,10 +148,12 @@ clean:
<li class="pb-2">&gt; &gt; Here, the object files gets removed when running <code-tag>make clean</code-tag></li>
</ul>
<paragraph>A quick note. It's very important that whenever something is indented in a makefile, that it's indented with a tab,
and not 4 spaces. It needs to be a tab character.</paragraph>
<paragraph>
A quick note. It's very important that whenever something is indented in a makefile, that it's indented with a tab,
and not 4 spaces. It needs to be a tab character.<br><br>
<paragraph>Now simply run the makefile with the following command.</paragraph>
Now simply run the makefile with the following command.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">
@ -155,8 +163,10 @@ gfortran -O2 -o hello hello.o
</code></pre>
</div>
<paragraph>We have now successfully compiled the program with the help of a makefile. Now simply run the program and we'll
see the output.</paragraph>
<paragraph>
We have now successfully compiled the program with the help of a makefile. Now simply run the program and we'll
see the output.
</paragraph>
<div class="font-mono shadow-lg shadow-slate-500 p-2 mb-6">
<pre><code class="text-sm">

11
src/components/Lisp/Lisp_Index.vue
View File

@ -1,11 +0,0 @@
<script setup lang="ts">
</script>
<template>
</template>
<style scoped>
</style>

11
src/components/Pascal/Pascal_Index.vue
View File

@ -1,11 +0,0 @@
<script setup lang="ts">
</script>
<template>
</template>
<style scoped>
</style>

23
src/main.ts
View File

@ -6,14 +6,13 @@ import App from './App.vue'
import Home from "./components/Home.vue";
import About from "./components/About.vue";
import FortranIndex from "./components/Fortran/Fortran_Index.vue";
import PascalIndex from "./components/Pascal/Pascal_Index.vue";
import LispIndex from "./components/Lisp/Lisp_Index.vue";
import FortranReadingFiles from "./components/Fortran/Fortran_Reading_Files.vue";
import FortranHelloWorld from "./components/Fortran/Fortran_Hello_World.vue";
import FortranSetUp from "./components/Fortran/Fortran_Set_Up.vue";
import FortranDataTypes from "./components/Fortran/Fortran_Data_Types.vue";
import FortranCallsMethodsFunctionsSubroutines
from "./components/Fortran/Fortran_Calls_Methods_Functions_Subroutines.vue";
import FortranCallsMethodsFunctionsSubroutines from "./components/Fortran/Fortran_Calls_Methods_Functions_Subroutines.vue";
import CIndex from "./components/C/C_Index.vue";
import CSetUp from "./components/C/C_Set_Up.vue";
const router = createRouter({
history: createWebHistory(),
@ -22,16 +21,14 @@ const router = createRouter({
{path: '/About', name: 'About', component: About},
{path: '/Fortran', name: 'Fortran', component: FortranIndex},
{path: '/Fortran/SetUp', name: 'SetUp', component: FortranSetUp},
{path: '/Fortran/HelloWorld', name: 'HelloWorld', component: FortranHelloWorld},
{path: '/Fortran/DataTypes', name: 'DataTypes', component: FortranDataTypes},
{path: '/Fortran/Methods', name: 'Methods', component: FortranCallsMethodsFunctionsSubroutines},
{path: '/Fortran/ReadingAFile', name: 'ReadingAFile', component: FortranReadingFiles},
{path: '/Fortran/SetUp', name: 'F_SetUp', component: FortranSetUp},
{path: '/Fortran/HelloWorld', name: 'F_HelloWorld', component: FortranHelloWorld},
{path: '/Fortran/DataTypes', name: 'F_DataTypes', component: FortranDataTypes},
{path: '/Fortran/Methods', name: 'F_Methods', component: FortranCallsMethodsFunctionsSubroutines},
{path: '/Fortran/ReadingAFile', name: 'F_ReadingAFile', component: FortranReadingFiles},
{path: '/Pascal', name: 'Pascal', component: PascalIndex},
{path: '/Lisp', name: 'Lisp', component: LispIndex}
{path: '/C', name: 'C', component: CIndex},
{path: '/C/SetUp', name: 'C_SetUp', component: CSetUp},
]
})