What should be the approach to frontend development, in general?
What is Front-end development?
What is needed for Front-end Development?
Now, let’s talk about some skills which are must in order to approach Front-end development.
- HTML / CSS: I know these two terms pops up everytime we talk about development or front-end development. There’s a valid justification, however, you won’t find a single front end developer who doesn’t call for (or expect) capability in these two languages.
Yet, we should take a step back and take a look at what HTML and CSS are.
HyperText Markup Language (HTML) is the standard markup language used to make website pages. A markup language is your method of making notes in a computerized report that can be recognized from standard content. It’s the most fundamental structure block you will require for developing sites.
CSS (Cascading Style Sheets) is the language used to introduce the report you make with HTML. Where HTML starts things out and makes the establishment for your page, CSS tags along straight away and is utilized to make the page’s format, shading and textual styles.
Both of these languages are significant to being a front-end developer. Basically, no HTML/CSS, no web advancement.
We did, however they’re both such a major piece of front-end development that a lot of other skills you’ll need are going to build off of them.
These were some basic skills that a front-end needs to acquire before approaching front-end development.
Now let’s have a quick view on 10 essential skills every front-end developer needs.
1.HTML/CSS:HTML is the most basic building block that you will need to develop websites and CSS is the language used to style the document you create with HTML.
4.CSS Preprocessing: CSS preprocessing lets you write code in the preprocessor’s language and then converts that code to CSS.
5.Version control/GIT: Version control software helps you to track changes so you can go back to a previous version of your work and find out what went wrong without tearing the whole thing down.
6.Responsive Design: Responsive design allows webpages to adjust themselves to the device you’re using without you doing anything on your end.
7.Testing/Debugging: Bugs are the reality of the development process, so in order to keep things moving you’ll need to test your code for bugs along the way.
10.Command Line: There will be times you’ll need to open a terminal on your computer and type commands in the command line(.CMD).
Finally, let’s take a look at some steps to approach Front-end Development.
- The first step is to install the development & production server using node, yarn etc.
- Install the required packages like webpack or laravel mix bootstrap, jQuery, webfont, loader etc.
- Then compiling all assets through webpack or laravel.
- Start slicing the PSD to HTML then WordPress.
- Checking responsive
- Check and conform score on https://web.dev/
- Go Live